1.清除浮動镶奉,解決高度塌陷(未測試)
a.偽類(抄襲bootstrap的做法).clearfix{}.clearfix:after{ display:table; content:' '; clear:both; }
b.王妮的做法.box{ clear:both; overflow:hidden; }
c.對于子元素寫margin-top把父級拖下來的情況
(百度說是W3C的標準夫嗓,只要破壞了父級子級緊貼的結構就可以了)
給父級寫border-top,或者給父級寫padding-top。
采用b方法也可以镜豹,a方法無效。
2.jq
http://jquery.cuishifeng.cn/
3.圖片懶加載
https://www.cnblogs.com/wangyihong/p/7808771.html
4.樓層導航
https://blog.csdn.net/srttina/article/details/80523547
5.字體縮放
-webkit-transform: scale(0.9);? ? /* for Chrome || Safari */
-moz-transform: scale(0.9);? ? ? ? /* for Firefox */
-ms-transform: scale(0.9);? ? ? ? /* for IE */
-o-transform: scale(0.9);? ? ? ? ? /* for Opera */
-webkit-text-size-adjust:none;
6.去掉記住密碼之后默認的背景色
input:-webkit-autofill , textarea:-webkit-autofill, select:-webkit-autofill {
-webkit-text-fill-color: #898989 !important;
-webkit-box-shadow: 0 0 0px 1000px transparent? inset !important;
background-color:#898989;
color:#898989;
background-image: none;
transition: background-color 50000s ease-in-out 0s; //背景色透明? 生效時長? 過渡效果? 啟用時延遲的時間
}
input {
background-color:#898989;
color:#898989;
}
7.超出顯示省略號(一行)原貼地址(https://www.cnblogs.com/da-yao/p/8081168.html)
white-space:nowrap;overflow:hidden;text-overflow:ellipsis; line-height: 1.5rem;
8.input (radio)的背景圖替換默認樣式
<div class="">
? ? <label><input type="radio" name="1"><i class="spot"></i>123456</label>
? ? <label><input type="radio" name="1"><i class="spot"></i>123456</label>
</div>
<style>
? ? label{
? ? ? ? display:inline-block;
? ? ? ? width:200px;
? ? ? ? height:50px;
? ? ? ? line-height:.8rem;
? ? ? ? text-align:left;
? ? ? ? position: relative;
? ? }
? ? label input{
? ? ? ? width: 15px;
? ? ? ? height: 15px;
? ? ? ? vertical-align: bottom;
? ? ? ? margin-right:.1rem;
? ? ? ? opacity: 0;
? ? }
? ? .spot{
? ? ? ? display:inline-block;
? ? ? ? width:17px;
? ? ? ? height:17px;
? ? ? ? background:url("image/radio.png") no-repeat;? /*默認的樣式圖片*/
? ? ? ? background-size:16px;
? ? ? ? position: absolute;
? ? ? ? top:.2rem;
? ? ? ? left:0;
? ? ? ? z-index:5;
? ? }
? ? input:checked + .spot{
? ? ? ? background:url("image/checked.png") no-repeat;? /*選中后的樣式圖片*/
? ? ? ? background-size:16px;
? ? }
</style>
8.js 判斷字符串中是否包含某個字符串
https://www.cnblogs.com/ooo0/p/7741651.html
9.百度線上地址
<script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
10.去除input點擊后的邊框
outline:none;