好记性不如烂笔头，一些前端的小tips，其实编程，很多时候不会把知识点都面面俱到，要学习的是编程思想，逻辑比较重要，同时养成比较好的编码习惯。面试基础很重要，这篇笔记记载一些前端面试的笔试题。
此为笔记二
是css相关的知识
字体属性连写的正确格式是? A
A.font: font-style font-weight font-size font-family;
B.font: font-style font-family font-weight font-size;
C.font: font-style font-family font-weight;
D.font: font-size font-family font-style font-weight;font属性中___font-size __和_____font-family_有两个属性是必写的后代选择器,选择器之间用___空格____连接.
并集选择器之间用____逗号___连接.
交集选择器: 两个选择器之间是__没有__空格设置颜色的赋值有几种方式,分别是什么?
四种.
1.使用具体的颜色来赋值：
Color: red;
2.十六进制表示法：
Color: #ff8400;
3.0rgb表示法：
rgb(0,0,0);(第一个对应的是红，第二个是绿，第三个是蓝)
注意：每个的取值是0-255;
rgba表示法,增加了透明度。如何使文本以大写字母开头？
A.text-transform:capitalize
B.无法通过 CSS 来实现
C.text-transform:uppercase
A
background-position:10px 20px中值代表的意思是？
A.距离顶部10px,距离底部20px
B.距离左边10px,距离右边20px
C.距离右边10px,距离下边20px
D.距离左边10px,距离上边20px
D
ss的三大特性:继承,层叠,优先级凡是以_____,_____,______开头的属性都是可以继承
line- text- font-
h标签的字体的大小不会从父元素继承过来
当父级块级元素的行高为20px，它内部子元素的行高是（）
A.0px;B.子元素不受影响;C.20px;D.未知;
答案 C行内元素的特点:可以多个标签放在同一行，给标签设置宽高没有作用，margin只对左右有效，上下没效果元素显示方式的转换：只需要修改_display____属性就可以了
设置一个元素为行内元素的方法是display:inline
设置一个元素为块级元素的方法是display:block如果div不设置宽高，那么这个div的宽从父元素直接继承，高度为0
div的宽是可以继承的，高是不可以继承的下面哪个不是CSS中的伪类（）
A.:link;B.:focus;C.:before;D.:actived;
C浏览器中一般情况下，默认的文字大小是（）
A.12px;B.14px;C.16px;D.18px;
答案 C
浏览器中一般情况下，默认的文字行高是（）
A.12px;B.14px;C.16px;D.18px;
答案 D.行高是指上下文本行的（）间的垂直距离。
A.顶线;B.中线;C.基线;D.底线;
答案 C某段落的样式如下：font-size:14px; line-height:1.5;那么这个段落的实际行高是（）
A.1.5px;B.21px;C.14px;D.15px;
答案 B背景不会应用到盒模型的哪个区域（）
A.内容区;B.内边距;C.边框;D.外边距;
答案 D.盒模型中哪个区域可以使用负值（）
A.内容区;B.内边距;C.边框;D.外边距;
答案 D为元素的padding-top设置百分数值时，百分数值是相对于其（）来计算的？
A.自身的height;B.父元素的height;C.自身的width;D.父元素的width;
答案 D盒模型中盒子实际的宽度指的是（）
A.width;
B.width+padding+border+margin;
C.width+padding;
D.width+padding+border;
答案 D当两个垂直外边距合并时，他们会（）
A.相加;B.相减;C.取较大的值;D.取较小的值;
答案 C使用单位_px_设置的行高是固定值
使用 em、%、不带单位的数字 这三种方式设置行高，行高的最终计算结果等于____文字大小_______ × 设置的行高值设置了___绝对定位_____、____浮动____、__固定定位__的盒子，不占原来的位置。相对定位后的元素会___占据____原来的位置，以___自己左上角________为基准设置定位。设置_____浮动___、___绝对定位_____、__固定定位______的元素会实现模式转换。固定定位以后的元素相对于___浏览器窗口___进行定位请写出浮动的至少3个特点。
答案 1:设置了浮动的元素，不占原来的位置。
2:可以让块级元素在一行上显示（脱离标准流）
（浮动找浮动，不浮动找不浮动）
3：浮动以元素顶部对齐。
4：元素设置浮动可以实现模式转换。将span元素左浮动之后，能否直接给它设置宽高？简述理由。
答案 可以直接给浮动后的行内元素设置行高。
因为浮动后会给元素生成块级框(即实现模式转换)。请写出使用伪元素清除浮动的CSS代码。
.clearfix:after {
content: "";
height: 0;
line-height: 0;
display: block;
visibility: hidden;
clear: both;
}
.clearfix {
zoom: 1;
}
请简述什么是子绝父相。
答案 1：单独标签设置定位的时候，以浏览器左上角为基准设置定位的。
2：盒子嵌套的时候，如果父盒子设置了相对定位，那么子盒子是以父盒子左上角为基准设置定位的。如果父盒子没有设置定位，那么子盒子以浏览器左上角为基准设置定位的。主流网站实现精灵图技术主要依靠CSS的（）属性
选项 A.background-position;B.background-color ;C.color; D.font;
答案 A
答案说明 实现精灵图技术主要是靠background-position控制背景图像的显示位置实现的
由于精灵图中集合了页面很多的小图像，有效减少了页面图片的数量，从而降低用户请求页面时候发出的请求数量如果需要设置一个元素的不透明度为50%，CSS属性应该设置为__________
答案 Opacity:0.5 CSS设置图片在页面中垂直居中的CSS属性是：vertical-align:middle
设置一个元素在页面中水平居中对齐的CSS是:margin:0 auto请简述display:none和visibility:hidden 的用途及区别
答案 两者都用于隐藏页面元素
visiblity:hidden :隐藏的元素在页面保留位置;
display:none :元素隐藏后不再占据页面位置;
答案说明 两者都是用于隐藏元素，但区别在于一个是完全隐藏，另一个会保留元素在页面的位置