2.position:absolute+margin-top:-100px+margin-left:-100px(需要直到div的宽高)
3.flex
4.绝对定位的top，left，bottom，right都设置为0，然后通过margin:auto实现水平垂直居中
5.display:table-cellvertical-align:middletext-align:center
6.calc函数计算实现
1. DOM结构 ：元素不会渲染
2. 事件监听 ：不能监听DOM事件
3. 继承 ：子元素不会继承
4. 性能 ：改变此属性会重排，性能较差
1. DOM结构 ：元素会渲染
2. 事件监听 ：能监听DOM事件
3. 继承 ：子元素会继承，可以通过visibility:visible来取消继承
4. 性能 ：改变此属性会重绘，性能较好
1. DOM结构 ：元素会渲染
2. 事件监听 ：能监听DOM事件
3. 继承 ：子元素会继承，而且不能通过opcity：1来取消隐藏
4. 性能 ：改变此属性会重绘，性能较好
window.divicePixelRatio=2(默认)
意思是：我们css中1px相当于实际移动端设备2px
1.border-width:0.5px
2.box-shadow内阴影模拟边框，
box-shadow:inset 0px -1px 1px 1px red
3.通过viewport设置rem的基准值，就可以直接写rem了，较好的解决方案
4.伪类+transform
通过:after或:before设置border，结合定位
两侧宽度固定，中间宽度自适应
所以我们要尽量少使用以上属性和方法
1.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />
<title>无标题文档</title>
<link href="style/index.css" rel="stylesheet" type="text/css" />
</head>
<body>
</body>
</html>
css文件里写入
@charset "utf-8"
body {
background:red
}
2.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />
<title>无标题文档</title>
<link href="style/index.css" rel="stylesheet" type="text/css" />
<style type="text/css">
p{
height:100px
width:100px
background:#00F
}
</style>
</head>
<body>
<div style="margin-bottom:10pxheight:100pxwidth:100pxbackground:green"></div>
<p></p>
</body>
</html>
css文件里写入
@charset "utf-8"
body {
background:red
}
3.
第三个问题是要你自己动手了
你直接就把上面的属性高宽值改变然后刷新下就成了
4.
在css文件中写入下面的代码
a{
text-decoration:none
}
BFC(Block formatting context)直译为"块级格式化上下文"。它是一个独立的渲染区域，只有Block-level box参与， 它规定了内部的Block-level Box如何布局，并且与这个区域外部毫不相干。
dom结构发生改变就会触发重排；重排一定会触发重绘；改变背景颜色会触发重绘
1.单冒号(:)用于CSS3伪类，双冒号(::)用于CSS3伪元素。
2.::before就是以一个子元素的存在，定义在元素主体内容之前的一个伪元素。并不存在于dom之中，只存在在页面之中。
:before 和 :after 这两个伪元素，是在CSS2.1里新出现的。起初，伪元素的前缀使用的是单冒号语法，但随着Web的进化，在CSS3的规范里，伪元素的语法被修改成使用双冒号，成为::before ::after
思路：统一向左浮动，中间的放在最前面浮动顺序中间->左边->右边，浮动后因为中间的宽度为100%；所有中间的占据一行；
左边的和右边的按顺序排列在下面；如果中间的不为100%的话，三者应该在同一条线上，向让左边的移动到中间的左边上面去可以给左边的加margin-left: 负中间的宽度的值；因为左边已经移动到中间的左边了，所以中间的右边紧挨着右边的；然后右边的在中间的右边的话只需要给右边margin-left:负右边自己的宽度的值；这样就把左边和右边分别放在了中间的左边和右边的位置；会遮挡中间部分内容；这是给外层container加padding: 0 右边宽度 0 左边宽度；这时中间左右会有空白，接下来我们只需要给左右 position: relative定位，然后左边left:自己的宽度；右边right: 自己的宽度就可以了
