前端（HTML+CSS）高频面试题（1）
HTML：
1.简述<!doctype>的作用？
答：
- 帮助浏览器正确地显示网页
<!DOCTYPE>声明叫做文件类型定义(DTD)，声明的作用是为了告诉浏览器该文件的类型。让浏览器解析知道应该用哪个规范来解析文档。
<!DOCTYPE>声明必须在HTML文档的第一行，这并不是一个HTML标签。
2.常见的浏览器及其内核？
答：
- pc端：
| chrome(谷歌) | firebox(火狐) | opero(欧朋) | IE(微软) | sarfari |
|---|---|---|---|---|
| blink(webkit分支) | gecko（高版本兼容谷歌内核） | presto（后来版本改成blink） | trident | webkit |
- 移动端：360、qq、UC、搜狗： 双内核（blink&trident）
3.b 和strong(i和em)标签的区别？
答：
-
以strong和b标签为例：
b标签仅仅只是给文字添加了加粗样式，属于UI层面的处理，除此之外没有任何意义。你甚至就可以把它看作是加了font-size:bold的css样式的span标签。 -
strong标签则是侧重于标签语义化，它是在告诉浏览器这是一段重点强调的内容。只不过它的默认样式恰好也是加粗。
-
此外，针对SEO（搜索引擎优化），strong标签与b标签相比更被搜索引擎重视，内容更容易被抓取到。同理，em标签也是语义化标签，而i标签只是仅仅加了斜体样式，并且em标签对SEO来说也更加友好。
4.谈谈对语义化的理解？
答：
- 概念：运用合适的标签和特定的属性去格式化文档（合适标签和属性要用在合适的场合）
优点：
- 易于开发和维护
- 用户体验比较好
- 易于seo,易于爬虫抓取关键字，能和搜索引擎建立良好的沟通。
- 即使在没有css样式的情况下，也能呈现良好的效果
CSS：
1.CSS引入方式有哪些？
答：
- 行内式
<div style="width: 200px;height: 200px;background-color: red;">1</div>- 特点：代码冗余，结构层与表示层不分离。
- 内嵌式（文本内部引入）
- 只作用于当前文档
<head>
<style>
/* 标签选择器 */
div {
width: 200px;
height: 200px;
background-color: blue;
}
</style>
- 特点：代码相对清晰，结构层与表示层不完全分离
- 外链式
- 可以作用于任何文档，需要link标签引入
<link rel="stylesheet" href="./css/index.css">- 特点：代码非常清晰，结构层与表示层完全分离
2.CSS基本选择器有哪些？
答：
通配符选择器：
- 格式：
* {
属性名:属性值;
属性名:属性值;
}
标签选择器：
- 格式：
标签 {
属性名:属性值;
属性名:属性值;
}
累选择器：
- 格式：
.类名 {
属性名:属性值;
属性名:属性值;
}
id选择器：
- 格式：
#id名 {
属性名:属性值;
属性名:属性值;
}
- 优先级
- id选择器>类选择器>标签选择器>通配符选择器
3.如何合并表格单元格
答：
-
合并列—colspan
-
合并行—rowspan
-
合并行的时候，比如rowspan=“2”，它的下一行tr会少一列；合并列的时候 colspan=“2”，此行的列会少一列
4.thead、tbody、tfoot有什么用？
答：
<thead>标签应该与<tbody>和<tfoot>标签结合起来使用，用来规定表格的各个部分（表头，主体，页脚）。<thead>标签用于组合HTML表格的表头内容。<tbody>标签用于组合HTML表格的主体内容。<tfoot>标签用于组合HTML表格的页脚内容。<thead>、<tbody>、<tfoot>标签默认不会影响表格的布局。
958
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
