1>.样式引入的方式有哪几种？
1.外部样式引入 使用最多
1.1 <link rel="stylesheet" type="text/css" href="" />
1.2 <head>
<style> @import url(css/index.css) </style>
</head>
2.内联样式 写在标签里面 style=" width="100px"; heigth="20px"; " 权重1000
2>.可以被继承的属性有哪些？请写出10个。
1、字体系列属性
font-family：字体系列
font-weight：字体的粗细
font-size：字体的大小
font-style：字体的风格（倾斜）
color：文本颜色
2、文本系列属性
text-indent：文本缩进
text-align：文本水平对齐
line-height：行高
word-spacing：单词之间的间距
letter-spacing：中文或者字母之间的间距
text-transform：控制文本大小写（就是uppercase、lowercase、capitalize这三个）
3.列表
list-style :none;
3、文本类型属性 ：可以被继承 特例字体颜色遇到a标签必须给a
3>.盒模型包含哪些内容？
内容 content
内边距 padding
边框 border
外边框 margin
4.可以取负值的属性有哪些？
background-position;
margin
text-indent（首行缩进）
定位中的位置top.botton
z-index
text-shadow box-shadow translata
5.单行文本超出显示省略号的效果怎么实现？
首先给盒子加个宽width
white-space: nowrap; 文本不换行 让文本一行显示
overflow: hidden; 超出部分隐藏
text-overflow:ellipsis; 超出部分内容...
6.用边框写一个箭头超右的三角形。
给一个宽高为零的盒子加边框 让其他三边边框颜色为透明颜色 transparent
7.元素分类哪几个类型？特点分别是什么？
块元素： block
特点：
1.默认情况下竖着排列 独占一行或者一块区域
2.给元素添加宽高都有效
3.给元素添加margin\padding都有效
4.一般可以作为其他元素的容器（父元素）
行内元素 （内联元素）：inline
特点：
1.元素挨着排列 并且有默认间距 （如何去掉默认间距：给这些标签的父级添加font-size：0 ；又因为字体大小会 被继承 所以得再把字体大小给行内元素本身）
2.在默认情况下，无法给元素添加宽高
3.在默认情况下，给元素添加的margin和padding值只有左右生效，上下不生效（行高可以改变文本上下）
行内块元素： inline-block
特点：
1.具备行内元素特点（默认间距、挨着排列）
2.具备块元素特点（能添加宽高、margin\padding上下左右都有效）
3.行内快元素有一个私有属性：vertical-align 垂直对齐方式 top/middle/bottom
可变元素：
8.如果实现未知宽高的图片在一块区域里面水平垂直居中？
① 首先水平居中：由于图片也属于超文本所以可以给个text-align：center
②再实现垂直居中 line-height vertical-align 让图片垂直居中
③去掉图片间隙问题 （下面的问题）
9.解决图片向下撑大3像素的方法有哪几种？
①给图片添加vertical-align:middle
②或者给图片加display:block
③或者给图片或父元素加浮动
④或者给body或父元素添加font-size:0;
10.让一个元素消失和出现的方法是什么？
1.display:none;和display:block;
2.opacity:0;和opacity:1;可以结合transition做过渡动画效果
11.定位的属性值有哪些？特点分别是什么？
文档流 层级关系 参照物
默认值
(一)绝对定位 position:absolute;
特点：
1.给元素添加绝对定位之后，元素会飘起来，不要自己原来的位置；
2.绝对定位是有参照物的，分为2种情况：
2.1在给元素设置绝对定位之后，如果这个绝对定位的元素的祖先（父元素、爷爷元素。。。一直到body）身上没有任何定位设置，就参照浏览器的第一屏做位置移动;
***2.2如果想让元素围绕着父元素或者祖先做位置移动，就需要在父元素或者祖先身上添加定位设置(position:relative;)。
(二)相对定位 position:relative;
特点：
1.给元素添加了相对定位之后，元素没有飘，还占着位置在；
2.也有参照物，就是参照自己原来的位置做移动
(三)固定定位 position:fixed;
特点：
1.给元素添加固定定位之后，元素会飘起来，不要自己原来的位置了；
2.也有参照物，参照物就是整个浏览器窗口，围绕着整个浏览器窗口做位置移动。
（四）position:sticky;粘性定位，主要用来做吸顶效果
特点：给元素添加粘性定位之后，元素没有飘，占着位置在
要想粘性定位有效果，一定要页面要有纵向滚动条，才能做吸顶效果（left，top，bottom）
滚动条：给body加高度
定位层级z-index
当定位遇到定位的时候，可能会发生层叠或者覆盖现象，这个时候就需要给定位的元素添加层级属性，z-index:0/auto;值越大，对应的元素就在最上层，相反。值越低，层级就在下层。
12.请写出一个宽高为200*200的（未知）小盒子在一个宽高为500*500的（未知）大盒子里面做水平垂直居中，请问有几种方法可以实现？6.5.7
1.纯margin + overflow:hidden;
2.纯padding + 记得做减法;
3.纯定位
4.利用行内块的特性 display:inline-block; + text-align:center + line-height + vertical-align:middle;
5.定位 + margin （margin-left和margin-top取负值）
6.定位 + margin:auto;
7.flex
13.透明属性是什么？兼容写法是什么？
opacity: 0.5;
filter: alpha(opacity=50“（0-100）);
14.高度塌陷问题怎么解决？6种
<!--在浮动布局中，父元素的高度默认被子元素撑开，但当子元素浮动时，会从文档流中脱离，导致无法撑起父元素高度，父元素高度丢失，下面的元素会自动上移，导致页面布局混乱。
高度塌陷（父元素高度为0）
问题描述：在父元素及祖先身上没有设置高度的时候，子元素又设置浮动了，就会出现高度塌陷情况。
解决方案：
1，给父元素添加height; 遇到高度需要自适应的时候就不好用了
2，给父元素添加属性 overflow:hidden; (bfc) 遇到定位就不好用了
3，给浮动的元素下方添加一个空的块元素（非浮动），给这个空的块元素添加属性 clear:both; 会造成代码的冗余
4，万能清除法。给到父元素添加类名
.clear:after{
content:"";
display:block;
clear:both;
height:0;
overflow:hidden;
visibility:hidden;
}
.clear{
zoom:1;
}
5.给父元素添加float会带来新的浮动问题。
6.给父元素添加display：block；
-->
15.min-height的兼容问题怎么处理？
在IE6及以下不兼容，
min-height
height:auto !important;
height:200px
16.一屏网页要注意什么？
要在body和html上都要加height
html，body{
height：100%；
}
17.5大浏览器的内核是什么？
1、IE浏览器内核：Trident内核，也是俗称的IE内核； -ms-
2、Chrome浏览器内核：统称为Chromium内核或Chrome内核，以前是Webkit内核，现在是Blink内核； -webkit-
3、Firefox浏览器内核：Gecko内核，俗称Firefox内核；-moz-
4、Safari浏览器内核：Webkit内核；
5、Opera浏览器内核：最初是自己的Presto内核，后来是Webkit，现在是Blink内核； -o-
18.什么是BFC？
BFC
文档流 页面
（如果上下两个盒子上面下边距，下面上边距）margin上下间距会发生重叠
取值的话是取最大的值作为间距
19.BFC的触发条件是什么？
解决办法：5个
1.给元素添加一个父元素，让父元素去触发BFC, 给父元素添加属性display：inline-block；overflow：hidden/auto/scroll；
20.怎么实现两栏布局？
左边固定宽 右边自适应(右边不给宽)
1.利用bfc的特性，让第一个盒子浮动，第2个盒子overflow：hidden（即使它具有bfc属性）
则有bfc的不会与浮动的盒子发生重叠分为左右两个盒子，也不会发生重叠（2个盒子固定高度，第1个固定宽度，第2个宽度会自适应）
2.第一个盒子浮动，第2个盒子左边距为margin-left：第一个盒子的宽度；
3.弹性盒，2个盒子加父元素，两个盒子都变成弹性盒，右边的盒子为flex：1；
4.calc实现两栏布局
减少对服务器的请求速度，提高速度
1属性选择器，2伪类选择器，3结构伪类选择器 child ：前面的元素都是清一色的同种
如果不是清一色，那就用nth-of-type
4.子代选择器，
用户体验度高，有利于开发和维护，还能提高网站性能，提高网站排名
26.css3的属性
文字阴影
text-shadow;0px;0px;3px 第一个是水平位置移动。正值往左，第2个值垂直移动，第3个阴影模糊程度，第4个颜色
盒子阴影 box-shadow：0px 0px 0px
内阴影 index
word-break:break-all;可以让浏览器在任意位置换行
word-wrap:break-word;在浏览器进行短句
background contain 不会被裁剪
边框弧度
background-image：border-radius：20px 30px 40px 50px； 顺时针方向，从左上开始
border-radius：20px 30px；对角值一样的 左上和右下
border-radius：50%；表示正⚪
linear-gradient线性渐变
radial-gradient径向渐变
26.
21.怎么实现三栏布局
答：方法一：左边盒子向左浮动，右边盒子向右浮动，中间盒子overflow：hidden
注意这种方法要将中间盒子和右边盒子调换顺序
方法二：左边盒子左上定位，右边盒子右上定位，中间盒子margin-左和右各两个盒子的宽度
方法三：左边盒子左浮动，右边盒子右浮动，中间盒子margin-左和右各两边盒子宽度
方法四：弹性盒
22、怪异盒是怎么产生的？有什么特点？怎么变成怪异盒
DOCTYPE的缺失会在IE6浏览器版本及其以下，会触发怪异模式，形成怪异盒模型，
特点：给盒子加border值和padding值，内边距和边框都不会给盒子撑大
css3新增加的属性，可以实现由W3C标准盒模型变成怪异盒模型
box-sizing:border-box;变成怪异盒模型
box-sizing:content-box；默认值 W3C标准。
22.H5有哪些特点？有哪些新增加的标签？请写出6个。
更简洁，标签语义化，语法更宽松，多设备跨平台，自适应网页设计
内容区：section 文章：article 与文章区相关区域：aside
头部：header 尾部 footer 导航：nav
23.CSS Sprites(图片整合技术)是什么？有什么优势？
将多张图片整合到一张图上，也叫精灵图或者是雪碧图，然后用背景定位实现图片定位的技术
减少服务器请求次数，提高页面加载速度，减小图片体积
24.常见的CSS3选择器有哪些？请说说你知道的。
1属性选择器，2伪类选择器（1）状态伪类 hover，3结构伪类选择器 child ：前面的元素都是清一色的同种
如果不是清一色，那就用nth-of-type
4.子代选择器， 层次选择器
25.CSS3属性有哪些？有什么特点？
text-shadow 文本阴影 box-shadow 盒子阴影 怪异盒word-break 是否换行 word-wrap 是否允许你断句
background-clip 背景裁切 background-origin 背景原点 background：linear-gradient线性渐变
radial-gradient 径向渐变
transition transform animation
26、请问transition和animation有什么共同点和区别？
都可以实现动画效果
transition必须结合：hover使用
1)相同点:都是随着时间改变元素的属性值。不同点:
2)而animation在不需要触发任何事件的情况下也可以显式的随着时间变化来改变元素css的属性值，从而达到一种动画的效果，css3的animation就需要明确的动画属性值。
参考网址:
https://daneden.github.io/animate.css/
27、请问transform:translateX(100px) rotatez(90deg);和transform: rotateX(90deg) translateX(100px);实现的效果是一样的吗？为什么？
不一样，旋转后的轴系改变了
28、移动端的布局方式有哪几种？
（淘宝适配 像素+百分比）
1、百分百布局
2、等比缩放布局（网易适配）
3、混合布局
29、什么是渐进增强和优雅降级
一开始只构建站点的最少特性，然后不断的对不同的浏览器追加不同的功能
一开始就构建站点的完整功能，然后针对浏览器进行测试和修复
字体图标设置大小用font-size
设置placeholder的样式
？？？/
30.什么是响应式布局？
补充
form表单里的button要指定类别，不然默认submit提交，会刷新页面，把名字和当作属性值，自动拼接到地址栏做get提交
6585
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
