让前端飞

html的介绍及常用标签

2020-12-03  本文已影响0人  前端萧萧

什么是HTML?

HTML: ( Hypertext Markup Language )超文本标记语言,是一种标识性的语言。它包括一系列标签.通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体。

特点:

HTML的基本结构:

HTML文档结构基本由以下四部分组成:

(1)文档声明:标志是:<!DOCTYPE HTML> ,声明这是一个HTML文档。

(2)html标签对:标志是:<html></html> ,标签的作用相当于程序在告诉网页浏览器,整个网页是从<html>这里开始的,然后到</html>结束。

(3)head标签对:标志是:<head></head>,head标签是页面的头部。

(4)body标签对:标志是:<body></body>,body标签是页面的身体,一般网页绝大多数的标签代码都是在这里进行编写。

常用标签:

<div>标签和<span>标签:

<div> 和 <span> 是没有语义的,它们就是一个盒子,用来装内容的。

<div> 这是div标签 </div>
<span> 这是span标签 </span>

特点:
1)<div> 标签用来布局,但是现在一行只能放一个<div>。
2)<span> 标签用来布局,一行上可以多个 <span>。

图像标签

在 HTML 标签中,<img> 标签用于定义 HTML 页面中的图像。

<img src="图像URL" />

img 是单词 image 的缩写,意为图像。src 是<img>标签的必须属性,它用于指定图像文件的路径和文件名。

代码示例:

    <img src="./img/1.gif" alt="松鼠">

<img> 标签必需的属性:

alt:规定图像的替代文本。
src:规定显示图像的 URL。

url可以使用绝对路径或者相对路径:

<!-- 相对路径写法 -->
<!-- ./ 表示当前文件所在目录,即G:/images/ -->
<!-- ./可省略不写 -->
<img src = "logo.png"/>
<img src = "./logo.png"/>

<!-- ../ 表示当前文件所在目录的上级目录,即G:/ -->
<img src = "../images/logo.png"/>

<!-- /表示根路径,即G:/ -->
<img src = "/images/logo.png"/>

<img> 常用属性:

超链接

超链接可以让我们从一个页面跳转到其他页面,或者是当前页面的其他的位置.

超链接的语法格式:

<a href="跳转目标" target="目标窗口的弹出方式"> 文本或图像 </a>

常用属性:

链接分类:

外部链接:
例:

 < a href="http:// www.baidu.com"> 百度</a >。

内部链接:网站内部页面之间的相互链接. 直接链接内部页面名称即可,

例:

 < a href="index.html"> 首页 </a >。
上一篇下一篇

猜你喜欢

热点阅读