HTML常用标签

前言:这里仅列出一些博主认为比较常用的标签,列出来便于浏览和记忆,完整的请查看[W3School]。


常用标签:

header nav main article div
section (具有类似主题的一组内容用多个section组成区块) 
aside   (与主要内容联系不大的内容区块、附注) 

文本的语义化元素:

p:              标记段落;
em:             强调的文本;
cite:           艺术品、电影、图书等;
small:          免责声明、注解、署名等;
strong:         标记重要文本;
b:              粗体,无意义,用于关键字、产品名;
i:              斜体,无意义,用于分类名称、技术术语等;
figure:         引用图片时的容器;
figcaption:     描述图片的标题(不是必须的);
blockquote:     定义长引述;
q:              定义短引述(会添加引号);
time:           比较时间和时间段,标签内部有datetime="",里面的时间为机器准备(可读)的;
abbr:           标记缩写词,可以加title属性解释缩写;
dfn:            定义术语;
sup:            定义上标;
sub:            定义下标;
address:        指定人员的联系信息,里面的内容会显示为斜体;
del:            标记已经删除的内容,效果为在 中的文字中间会有一条横线(删除线);
s:              标注不再准确或不再相关的内容,效果同del;
ins:            标记增加的内容,效果为文字下划线;
code:           标记代码示例或者文件名,若代码需要显示<和>,用转义符<和>;
pre:            可以使里面的文本的空格、换行等保持在网页中显示(通常浏览器会将空格等压缩),适用于展示代码等(pre中的文本不会自动换行,可能会影响页面布局,产生横条,所以有一个CSS规则让pre打开自动换行:pre{ white-space: pre-wrap; };
mark:           效果类似荧光笔涂抹在需要重视的内容上,用来引起注意;
br:             属于空元素,输入

都可以换行; span: 用于包围字词或短语,无语义;

不常用元素:

与计算机相关:kdb、samp、var
kdb:            标记用户输入指令;
samp:           标记(指示)程序或系统的示例输出;
var:            表示变量或占位符的值;

其他:u、wbr、ruby/rp/rt、bdi/bdo、meter、progress
u:              标记专有名词或文本拼写有误,效果为下划线;
wbr:            用法和br类似,但不是强制换行,而是提示浏览器“该处可以根据需要换行”;
ruby:           旁注标记,用来表示生僻字的发音,比如在中文字头上加拼音,与rp和rt元素搭配使用;
bdi/bdo:        用于从右至左的语言;
meter:          用于表示分数的值或已知范围的测量结果;

你可能感兴趣的:(HTML与CSS)