CSS的全局通用样式在开发移动端网页时非常重要。全局通用样式可以减少代码冗余,提高网站性能,同时也可以保证网页在不同设备上的显示效果一致。以下是几个常用的全局通用样式示例:/ 去除默认样式 / htm...
CSS的全局通用样式在开发移动端网页时非常重要。全局通用样式可以减少代码冗余,提高网站性能,同时也可以保证网页在不同设备上的显示效果一致。
以下是几个常用的全局通用样式示例:
/* 去除默认样式 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
/* 使移动设备的1px像素边框变细 */
@media only screen and (-webkit-min-device-pixel-ratio: 2){
*::before,*::after {
-webkit-transform:scale(0.5);
transform:scale(0.5);
}
}
/* 浏览器默认字体大小 */
body {
font-size: 16px;
font-family: Arial, sans-serif;
line-height: 1.6;
}
/* 文字省略号 */
.ellipsis{
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/* 按钮禁用效果 */
.disabled {
cursor: not-allowed;
opacity: 0.4;
} 这些全局通用样式可以作为基础样式,不仅可以提高开发效率,还可以保证网站的一致性。在开发移动端网站时,推荐将这些基础样式添加到自己的CSS文件中,以便快速开发。