无序列表--没有顺序的一组内容
语法:
<ul> 定义无序列表
<li>列表项1</li>
<li>列表项2</li>
</ul>
语义:用于将没有数字顺序的一组内容或数据进行分组。
样式:
默认间距(上下外间距、左边内边距)
列表样式:实心圆
type属性---ul
disc---实心圆
circle---空心圆
square---正方形
none---取消前面的列表符
注意:type属性不常用,通常用css属性进行代替
应用场景:
新闻列表
商品列表
导航、分页、选项卡
自定义列表:
语法:
<dl>
<dt>专业名词/dt>
<dd>对专业名词进行解释1</dd>
<dd>对专业名词进行解释2</dd>
</dl>
语义:对专业名词进行定义和描述的列表
dl 定义自定义列表
dt 自定义列表项
dd 自定义列表的注释(解释、描述)
用于将一组项目及其相关的描述进行分组列表
默认样式:
dl自带外边距(上下)、dd,自带左边的外边距
应用场景:
名词解释;
分类
注意事项:允许使用多条项目的定义和描述
图片:img标签定义html页面中的图像
语法:
<img src=" " alt=" ">
属性:
src属性:
作用:用于指定图像文件的路径和文件名
必需属性
alt属性:
作用:用来指定替换的文本,当图片加载失败,显示该文字对图像进行替换,有利于用户体验
title属性:
当鼠标悬停在图片上,鼠标的右下角出现对应的文字,对图片进行解释说明,有利于用户体验
width/height属性:
作用:用于指定图片的宽度/高度
注意事项:如果只指定宽或高其中一个,另一个值会按照原比例等比缩放
默认样式:多张图片在一行显示
图片之间有间隙--换行会被解析成空格
默认产生下间隙
路径:images文件夹存放图片,找图片时,就需要通过路径来描述图片文件的位置。
URL--统一资源定位符
绝对路径:
网络上的绝对路径:
语法:http://...
本地绝对路径:
语法:C:\...
特点:绝对URL始终指向同一位置,无论在何处使用。
注意事项:在链接到同一个网站的其他位置时,应该尽可能使用相对路径,链接到另外一个网站时,需要使用绝对链接。
相对路径:
指是由这个文件所在的位置为参考基础,而建立出的目录关系,常用的描述路径的方法:当前目录、上一级目录、下一级目录
当前目录:
语法:./ 如果引用的文件和当前的文件处在同一级 ./ 可以省略
上一级目录:语法:../
下一级目录:语法:/
超链接
默认样式:
不独占一行
自带下划线、字体颜色
默认在当前窗口打开
属性:
href属性:
作用:指定链接的跳转地址
target属性:
作用:指定目标地址的打开方式
取值:_self 默认值,在当前窗口打开
_blank 新建窗口打开
title属性:
作用:定义提示文本,当鼠标悬停在链接上时会显示,提示工具
外部链接
内部链接
空链接
下载链接
锚点跳转
单页面锚点跳转
概述:当我们点击锚点链接时,可以快速定位到页面中的某个位置。
语法:
跳转链接:<a href=“#id名称”></a>
目标点:<开始标签 id=“#id名称”>内容</结束标签>
多页面的锚点跳转
语法:
跳转链接:<a href=“页面的路径#id名称”></a>
目标点:
文本格式化标签
em:语义:用于强调标记的内容
默认样式:
斜体显示
不独占一行
i:无语义:只是样式有倾斜效果
默认样式:
斜体显示
不独占一行
strong:语义:用于强调标记的内容
默认样式:
粗体显示
不独占一行
i:无语义:只是样式有加粗效果
默认样式:
粗体显示
不独占一行
del:
在文档中有一条删除线
默认样式:
带有中划线
独占一行
span:万用标签
通常用来区分文本样式:
无语义
无默认样式
br:换行标签
<br>强制换行
sup:上标标签
sub:下标标签
————————————————
版权声明:本文为CSDN博主「he1729」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/he1729/article/details/127654625