HTML学习笔记02--常见标签

1.html根标签

一个页面有且仅有一个根标签,网页中所有内容都应该写在html根标签中。

<html>  
</html>

2.head标签

该标签中的内容不会在网页中直接显示,用来帮助浏览器解析页面。

<head>
</head>

3.title标签

网页的标题标签,默认会显示在浏览器的标题栏中;搜索引擎在检索页面时,会首先检索title标签中的内容;

它是网页中对于搜索引擎来说最重要的内容,会影响到网页在搜索引擎中的排名。

<title>标题标签</title>

4.body标签

用来设置网页的主体内容,网页中所有可见内容都应写在body标签中。

<body>
</body>

5.标题标签

在HTML中,一共有六级标题标签,h1~h6;

说明:

1)在显示效果上,h1最大,h6最小,但文字的大小我们并不关心,使用HTML标签时,关心的是标签的语义,我们使用的标签都是语义化标签;

2)6级标题中,h1最重要,表示一个网页中的主要内容,h2~h6重要性依次降低;

3)对于搜索引擎来说,h1的重要性仅次于title,搜索引擎检索完title,会立即查看h1中的内容;

4)h1标签非常重要,会影响到页面在搜索引擎中的排名;

5)页面中只能写一个h1;

6)一般页面标题标签只使用h1,h2,h3,h3以后的基本不用。

<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>

6.段落标签

用于表示内容中的一个自然段

使用p标签来表示一个段落;

说明:

1)在HTML中,字符之间写再多的空格,浏览器也会当成一个空格解析;

2)换行也会当成一个空格解析;

<p>
这是一个段落
</p>

7.br标签

在页面中可以使用br标签来表示一个换行,br标签是一个自结束标签。

<br>
或
<br />

8.hr标签

hr标签也是一个自结束标签,可以在页面中生成一个水平线。

<hr />

9.图片标签

使用img标签来向网页中引入一个外部图片,img标签也是一个自结束标签。

属性:

src:设置外部图片的路径;

alt:可以用来设置在图片不能显示时对图片的描述,搜索引擎可以通过alt属性来识别不同的图片,如果不写alt属性,则搜索引擎不会对img中的图片进行收录;

说明:

1)src属性配置的是图片的路径,目前所使用的路径全都是相对路径;

2)相对路径:相对于当前资源所在目录的位置;

3)使用../来返回上一级目录,返回几级目录就写几个../;

 

width:修改图片宽度,使用px作为单位;

height:修改图片高度,使用px作为单位;

说明:

1)宽度和高度两个属性如果只设置一个,另一个也会同时等比例调整大小;

2)如果两个值同时指定,则按照指定的值来设置;

3)一般开发中除了自适应页面,不建议设置width和heigth;

<img src="../2.gif" alt="松鼠" width="100px" heigth="500px" />

10.内联框架

使用内联框架可以引入一个外部页面,使用iframe来创建一个内联框架;

属性:

src:指向一个外部页面的路径,可以使用相对路径;

width:修改框架宽度,单位:px

height:修改框架高度,单位:px

name:可以为内联框架指定一个name属性。

<iframe src="demo02.html"></iframe>

说明:

在现实开发中不推荐使用内联框架,因为内联框架中的内容不会被搜索引擎所检索 。

11.center标签

center标签中的内容会默认在页面中居中显示,可以将要居中的元素都放在center中。

<center>居中显示</center>

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值