一,基础标签
1.单标签和双标签
这时候就会有人问什么是单标签和双标签呢? 说白了就是 单一出现的就是单标签 成对出现的就是双标签 看一下下面的例子
![](https://img.haomeiwen.com/i24559446/7a22844586bfcc98.png)
2.一些简单的基本标签
1.<div></div> 可以说是一个箱子或一个容器,可以放任何东西
2.<p></p> 用来包裹一段文字的
3.<h1>---<h6> 标题 是网页的1级--6级标题 注意!!! (一个网页中只能有一个1级标题 其他的可以随便加) 如下图
因为h1标题一般用作于logo 提高索引能力的
![](https://img.haomeiwen.com/i24559446/b1f0b4a53e309f17.png)
![](https://img.haomeiwen.com/i24559446/e297fb0b8a32a5d2.png)
4.<span></span> 包裹文字的 (可设置个别文字样式)
5.<i></i> 使文字倾斜样式
![](https://img.haomeiwen.com/i24559446/fa5e9fb743edfa8b.png)
6.<b></b> 使文字加粗样式
![](https://img.haomeiwen.com/i24559446/e9fa83b367574889.png)
7.<img> 是用来引入图片的标签 格式是<img src="" alt="" title="" width="" height="">
img里面有四个基本属性
src="":是用来引入图片路径的 (路径分为两种 相对路径和绝对路径)
相对路径:是从网页创建文件夹出发寻找.(建议使用相对路径)
相对路径:从盘开始找起(文件路径容易改变,使无法找到其内容)
./属于打开本层文件夹 ../打开更上层文件夹 加一个点是一层 依次递增
alt="":给开放人员看的 一种描述 ,(描述图片的大小等等...)
title="":提示文字(每一个标签都有的 )
鼠标长时间放上面会有文字提示,或网速较慢时图片加载不出来会优先显示的文字
8.<a></a> 超链接(就是跳转其他页面)
属性 href="目标地址" #是空链接
target 打开新网页 _blank 每点击一下就打开一个新的网页
_new (乱写也是一样) 打开一新的网页 不会打开多个
_self 默认 打开自身网页
9.ul>li 无序列表(ul是li的父级)
![](https://img.haomeiwen.com/i24559446/aed40dad32222280.png)
![](https://img.haomeiwen.com/i24559446/fa4850629fd11432.png)
在ul里添加行内css可以改变前面所带的默认样式
style="list-style:none" 去掉默认样式
disc 黑圆点
circle 空心圆
square 正方块 如下图
![](https://img.haomeiwen.com/i24559446/172282a20548458d.png)
10.有序列表 ol>li
![](https://img.haomeiwen.com/i24559446/07b692f2f7c3bc17.png)
![](https://img.haomeiwen.com/i24559446/639ba548bd3bb6d5.png)
在ol里面添加 行内 type="1 a A I" 跟前面的无序列表相似,也可以改变前面的默认样式
11.对话列表 dl>dd dt
<dl>
<dt>我说</dt> <!--可以理解成说话的人-->
<dd>你真帅气</dd> <!--说话的内容-->
</dl> 看下方例图
![](https://img.haomeiwen.com/i24559446/97fe45eebfad39fc.png)
3. 一些特殊标签
<br/> 换行标签
<hr/> 换行加下划线
空格
< ;小于号 >大于号
© 版权
4.注释
html的注释: <!-- 注释的内容-->
css的注释: /*注释的内容*/
网友评论