[21届]web前端开发实习生岗位面试准备----CSS

一、块级元素和内联元素的区别

CSS规范规定，每个元素都有display属性，确定该元素的类型，每个元素都有默认的display值

1. 块级元素的特点：
   • 总是在新行上开始
   • 高度、行高以及内外边距都可以控制
   • 宽度默认是它容器的100%，除非设置一个值
   • 它可以容纳内联元素和其他块级元素
2. 内联元素的特点：
   • 和其他元素都在同一行
   • 高度、行高以及内外边距都不可控制
   • 宽度就是它的文字或图片的高度，不可改变
   • 内联元素只能容纳文本或者其他内联元素

常见的块级元素：div、from、h1-h6、hr、ol、ul、li、table、p、pre、
常见的内联元素：a、b、br、em、i、img、input、label、select、span、strong、textarea

二、属性问题

1. 请列举出至少 5 个具有继承特性的 css 属性
   - font-size
   - font-family
   - color
   - line-height
   - text-align
   - text-indent
   - list-style

2. 请阐述display:none 和 visibility:hidden 的区别
   - display:none 隐藏对应的元素，在文档布局中不再给它分配空间
   - visibility:hidden 隐藏对应的元素，但是在文档布局中仍保留原来的空间。

3. 请列出 display 属性除了none 以外的其他 3 个常用值，并分别说明每个值的作用
   - display: inline | block | inline-block
   - inline 布局特点转为行内元素
   - block 布局特点转为块级元素
   - inline-block 布局上同时具有行内、块级元素的特征

4. 在页面重构时，为什么要先重置 css 样式？
   因为浏览器的兼容问题，不同浏览器对有些标签的默认值是不同的，如果没对 CSS 初始化往往会出现浏览器之间的页面显示差异

5. 请列举出至少 4 个 css3 属性
   - border-raduis
   - box-shadow
   - text-shadow
   - transform
   - transition

6. 请列举出至少 6 种 css 选择器
   - id 选择器（#id）
   - 类选择器（.classname）
   - 标签选择器（div、h1、p）
   - 后代选择器（li a）
   - 属性选择器（a[ref=”external”]）
   - 孩子选择器（ul > li）

7. position 属性的取值？这些取值分别是相对什么进行定位？
   取值：relative、absolute、fixed
   - relative：无 top、left 设置时，元素自身在文档流中的位置
   - absolute：相对于上级元素中第一个 position 属性非 static 的元素
   - fixed：相对于浏览器视窗

8. CSS sprite
   把多个图片组合成一个，然后计算显示区域和图片位置，其他的隐藏。（未来会被http2取代）