首先是我个人认为关于html的一些需要理解的常见面试题
- div+css 的布局较 table 布局有什么优点
- 对结构和样式方便维护
- 页面加载速度更快、结构化清晰、页面显示简洁。
- 表现(样式)与结构相分离。
- 搜索引擎更友好，排名更容易靠前。
- img 的 alt 与 title 有何异同？
- alt 属性用来指定图片替换文字(当图片不能显示的时候可以展示,或者供SEO识别图片内容)
- title 属性:可用于设置鼠标悬停时图像的提示文字
- 简述一下 src 与 href 的区别
- src 用于替换当前元素，href 用于在当前文档和引用资源之间确立联系。
- src :
- 是指向外部资源的位置，指向的内容将会嵌入到文档中当前标签所在位置
- 在请求 src 资源时会将其指向的资源下载并应用到文档内,并阻塞当前html渲染，例如 js 脚本，img 图片
- href :
- 指向网络资源所在位置，建立和当前文档之间的链接，
- 如link元素,那么浏览器会识别该文档为 css 文件，就会并行下载资源并且不会停止对当前文档的处理。
- html元素的分类
-
按照显示模式分类
- 块属性元素(block):div p h li ol ......
- 行属性元素(内联元素)(inline):span a em strong var b i u ....
- 特殊情况:img标签 textarea标签 input标签 三个元素也是行属性元素,但是因为这3个标签是替换元素,所以可以设置宽高(我们可以把这三个元素称作为行内替换元素)
- 行内块元素(inline-block):特征是行内显示,可以设置宽高(img等元素只是类似于行内块元素)
-
按照是否替换分类
- 替换元素:一般来说替换元素没有实际内容,是一个空元素,浏览器根据元素的标签或者属性,来决定当前显示的具体内容,比如img input textarea select都是替换元素
- 非替换元素:html中大多数元素都是非替换元素,也就是说内容是直接表现给浏览器的
-
按照是否是空元素分类
- 空元素:标签内没有内容的 HTML 标签被称为空元素(一般就是指的是单标签)。空元素是在开始标签中关闭的。
- 常见的空元素有：br hr img input link meta
- html标签的语义化
- 语义化标签更具有可读性，便于团队的开发和维护
- 没有css的情况下，网页也能很好的呈现出内容结构和代码结构
- 关于SEO，搜索引擎更能理解到网页中各部分之间的关系，更准确更快速搜索信息
- SEO是什么?作为前端我们应该怎么做?
- 搜索引擎优化，指在了解搜索引擎自然搜索机制的基础之上，对网站进行内部及外部的调整优化，改进网站在搜索引擎中关键字的自然排名
- 优化方式1:喂养爬虫
- 建立更多链接到自己网站的链接，来留住爬虫，提高网站排名。
- 提高网站加载速度，让爬虫在一定时间内能够访问更多网页
- 优化方式2:HTML代码层面
- 标签语义化：根据标签的语义合理使用
- 图片alt一定要合理书写
- a标签内部的文本（锚文本）要合理书写
- 合理利用搜索引擎重视的标签(title，strong，h1-h3，a，em，img&alt）
- 优化方式3:Meta标签的关键字和网站描述的设置
<meta name="keywords" content=""><meta name="description" content="">注：后续可能还会更新，本人只是新手，文章仅供参考，如有不对，请多担待
