移動端css樣式初始化
阿新 • • 發佈:2019-02-15
@charset "utf-8"; /* 禁用iPhone中Safari的字號自動調整 */ html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; /* 解決IOS預設滑動很卡的情況 */ -webkit-overflow-scrolling : touch; } /* 禁止縮放表單 */ input[type="submit"], input[type="reset"], input[type="button"], input { resize: none; border: none; } /* 取消連結高亮 */ body, div, ul, li, ol, h1, h2, h3, h4, h5, h6, input, textarea, select, p, dl, dt, dd, a, img, button, form, table, th, tr, td, tbody, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } /* 設定HTML5元素為塊 */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } /* 圖片自適應 */ img { width: 100%; height: auto; width: auto\9; /* ie8 */ display: block; -ms-interpolation-mode: bicubic;/*為了照顧ie圖片縮放失真*/ } /* 初始化 */ body, div, ul, li, ol, h1, h2, h3, h4, h5, h6, input, textarea, select, p, dl, dt, dd, a, img, button, form, table, th, tr, td, tbody, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { margin: 0; padding: 0; } body { font: 12px/1.5 'Microsoft YaHei','宋體', Tahoma, Arial, sans-serif; color: #555; background-color: #F7F7F7; } em, i { font-style: normal; } ul,li{ list-style-type: none; } strong { font-weight: normal; } .clearfix:after { content: ""; display: block; visibility: hidden; height: 0; clear: both; } .clearfix { zoom: 1; } a { text-decoration: none; color: #969696; font-family: 'Microsoft YaHei', Tahoma, Arial, sans-serif; } a:hover { text-decoration: none; } ul, ol { list-style: none; } h1, h2, h3, h4, h5, h6 { font-size: 100%; font-family: 'Microsoft YaHei'; } img { border: none; } input{ font-family: 'Microsoft YaHei'; } /*單行溢位*/ .one-txt-cut{ overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } /*多行溢位 手機端使用*/ .txt-cut{ overflow : hidden; text-overflow: ellipsis; display: -webkit-box; /* -webkit-line-clamp: 2; */ -webkit-box-orient: vertical; } /* 移動端點選a連結出現藍色背景問題解決 */ a:link,a:active,a:visited,a:hover { background: none; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color: transparent; } .w50{ width: 50%; } .w25{ width: 25%; } .w20{ width: 20%; } .w33{ width: 33.333333%; } .fl{ float: left; } .fr{ float: right; } .db{ display: block !important; } .dn{ display: none; }