2019-03-04 查漏补缺

<img src="#" alt="test2.jpg"/>alt=alternative(可选内容)

如果前边的图片下载失败,则选用alt内的图片进行展示

dl=description list 描述列表...dt=description term 描述单词..dd=description definition描述单词的定义

<dl>

              <dt>年龄</dt>

              <dd>18</dd>

</dl>

常用块级元素

P

paragraph,段落,用得非常多的元素

div

division/section(HTML5新增元素),该标签用于将文档分割为不同部分

br

换行,br是空标签,他常常被无用做p,我们后面需要介绍他与p的区别,并且说说他与闭合浮动之间的关系。

h1——h6 一级标题到六级标题

heading,我们需要了解在各个浏览器中各个h的margin、padding、font-size

ul ol li

无序、有序列表

dl dt dd

定义列表相当于词典里面词的解释就可以用这种列表

hr

表示主体结束,而不完全是水平线


常用行内元素

a

anchor,链接(锚点),我们可以研究下a标签在各个阶段的样式啦

span

常用于包裹我们的行内元素

em strong

内容强调,em(emphasize)是做强调的,strong是用作重点强调的

b

bold 粗体,没强调的意思

i

italic 单纯的斜体

u

underline,单纯的加下划线

select option

创建可单选或多选的菜单

img

图片标签

input text

文本

input radio checkbox

单选框、多选框

input submit button

按钮

table

用于展示表格类数据

为什么要语义化标签

有时候我就在想我为什么要研究这个,为什么要语义化标签,一个比较俗气的现实就是:

你了解语义化标签才能找到好工作!

但是作为一个有一点理想的前端,我们是应该了解这些东西的

因为我们的html才是基本结构,css相当于一种装饰,装饰在的时候我们的页面光鲜,那么装饰去除的时候,我们也不能太丑!!!

这就是一个美女化妆与穿衣服的原理了,传了惊艳四座,不穿至少需要惊艳到个人吧。

而且对于SEO,对于移动设备,对于盲人阅读器都会更好,所以我们有必要研究下我们标签的本来面目。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容