9.遇到过一个问题就是，当手机端点击input弹出键盘，整个视窗的高度就会变为减去键盘的高度，页面底部样式会乱，当时解决方法是用js获取整个页面高度赋值给body，等于说在不同的设备下写死不同的body高度值，底部就不会乱了
$("body").css("height",parseInt($(".wrap").height())+parseInt($(".icon-main").height()));
10.如果想改变 placeholder里的文字，需要用c伪类
::-webkit-input-placeholder{
color:#ccc
}
一.css制作不同方向的三角形边框
.borderBox {
position: relative;
margin-top: rem(22);
margin-left: rem(20);
width: rem(630);
border: 1px solid #DCD2C5;
border-radius: rem(8);
}
本例是向上三角形边框(其他方向可以通过修改diamond中的 rotate(45deg)值，如（ rotate(135deg)向右等）)
.tipsAngle{
position:absolute;
top:-rem(12);
left: rem(328);
display: block;
width: rem(20);
height: rem(20);
font-size: 0;
background: #F9F5EC;
border-left: 1px solid #DCD2C5;
border-top: 1px solid #DCD2C5;
}
.diamond是用来设置兼容不同浏览器的三角形边框设置，跟tipsAngle样式在一个标签中一起使用
具体使用的html如下：
<div className="borderBox">
<div className="tipsAngle diamond"></div>
</div>
.diamond{
-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.7071067811865475, M12=-0.7071067811865477, M21=0.7071067811865477, M22=0.7071067811865475, SizingMethod='auto expand')";
filter: progid:DXImageTransform.Microsoft.Matrix(
M11=0.7071067811865475,
M12=-0.7071067811865477,
M21=0.7071067811865477,
M22=0.7071067811865475,
SizingMethod='auto expand'
);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform:rotate(45deg);
}
:root .diamond{filter:none\9;}
制作实心三角形：
向上三角形
.arrow-up {
position: absolute;
left: rem(52);
top: -rem(22);
width: 0px;
height: 0px;
border-left: rem(30) solid transparent;
border-right: rem(30) solid transparent;
border-bottom: rem(30) solid #F3EEE3;
font-size: 0px;
line-height: 0px;
}
向下箭头 ，类似
.arrow-down {
width: 0px;
height: 0px;
border-left: 30px solid transparent;
border-right: 30px solid transparent;
border-top: 30px solid blue;
font-size: 0px;
line-height: 0px;
}
div.arrow-left {
width: 0px;
height: 0px;
border-bottom: 30px solid transparent;
border-top: 30px solid transparent;
border-right: 40px solid green;
font-size: 0px;
line-height: 0px;
}
div.arrow-right {
width: 0px;
height: 0px;
border-top: 30px solid transparent;
border-bottom: 30px solid transparent;
border-left: 60px solid black;
font-size: 0px;
line-height: 0px;
}
二.css清除浮动
1.父级div定义高度；（不推荐使用，只建议高度固定的布局使用）。
**2.结尾处加空的div标签clear:both; **(添加一个空的div，利用的clear:both清除浮动，让父级自动获取高度)。
3.父级div定义伪类:after和zoom; (推荐使用，建议定义公共类，以减少代码)clearfloat:after{
display:block;
clear:both;
content:"";
visibility:hidden;
height:0;
}
clearfloat:{zoom:1;}
4.父级定义overflow:hidden;( 必须定义width或zoom:1,同时不能定义height，使用overflow:hidden时，浏览器会自动检查浮动区域的高度)。
优点：简单、代码少、浏览器支持少；缺点：不能和position配合使用，因为超出部分会被隐藏
5.父级div定义overflow:auto()；（必须定义width或zoom:1,同时不能定义height，使用overflow:auto时，浏览器会自动检查）
6.父级div也一起浮动；（没有优点，会产生新的浮动问题，不推荐使用，只做了解）
7.父级div定义display:table(原理：将div属性变成表格，没有优点，会产生新的未知问题，不推荐使用，只做了解)
