Create 总结

[simplelucky]

css总结

[simplelucky]

闭合浮动： body:before, body:after { content: ""; display: table; } body:after { clear: both; }

[simplelucky]

rem适用： @media only screen and (max-width: 1080px), only screen and (max-device-width:1080px) { html,body { font-size:16.875px; } } @media only screen and (max-width: 960px), only screen and (max-device-width:960px) { html,body { font-size:15px; } } @media only screen and (max-width: 800px), only screen and (max-device-width:800px) { html,body { font-size:12.5px; } } @media only screen and (max-width: 720px), only screen and (max-device-width:720px) { html,body { font-size:11.25px; } } @media only screen and (max-width: 640px), only screen and (max-device-width:640px) { html,body { font-size:10px; } } @media only screen and (max-width: 600px), only screen and (max-device-width:600px) { html,body { font-size:9.375px; } } @media only screen and (max-width: 540px), only screen and (max-device-width:540px) { html,body { font-size:8.4375px; } } @media only screen and (max-width: 480px), only screen and (max-device-width:480px) { html,body { font-size:7.5px; } } @media only screen and (max-width: 414px), only screen and (max-device-width:414px) { html,body { font-size:6.46875px; } } @media only screen and (max-width: 400px), only screen and (max-device-width:400px) { html,body { font-size:6.25px; } } @media only screen and (max-width: 375px), only screen and (max-device-width:375px) { html,body { font-size:5.859375px; } } @media only screen and (max-width: 360px), only screen and (max-device-width:360px) { html,body { font-size:5.625px; } } @media only screen and (max-width: 320px), only screen and (max-device-width:320px) { html,body { font-size:5px; } } @media only screen and (max-width: 240px), only screen and (max-device-width:240px) { html,body { font-size:3.75px; }

[simplelucky]

-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;

webkit内核的浏览器(chrome)中,当在css中定义的中文font-size小于12px的时候,浏览器仍然使用12px,这时就可以用-webkit-text-size-adjust:none; 注意,-webkit-text-size-adjust放在body中会导致页面缩放失效,不要把-webkit-text-size-adjust设置为全局或者可继承的

若要打开缩放则使用：*{-webkit-text-size-adjust:auto !important;}

[simplelucky]

vertical-align对inline元素起作用

[simplelucky]

在title左添加图片：