Css样式初始化

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了Css样式初始化，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含3161字，纯文字阅读大概需要5分钟。

内容图文

web端常用公共样式

html{
	color:#000;
	background:#FFF;
}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,footer,article,aside,header,section,nav,figure,figcaption,hgroup{
	margin:0;
	padding:0;
}table{
	border-collapse:collapse;
	border-spacing:0;
}fieldset,img{
	border:0;
}address,caption,cite,code,dfn,em,strong,th,var{
	font-style:normal;
	font-weight:normal;
}ol,ul{
	list-style:none;
}caption,th{
	text-align:left;
}h1,h2,h3,h4,h5,h6{
	font-size:100%;
	font-weight:normal;
}q:before,q:after{
	content:'';
}abbr,acronym{
	border:0;
	font-variant:normal;
}sup{
	vertical-align:text-top;
}sub{
	vertical-align:text-bottom;
}input,textarea,select{
	font-family:inherit;
	font-size:inherit;
	font-weight:inherit;
	*font-size:100%;
}legend{
	color:#000;
}#yui3-css-stamp.cssreset{ display:none}

移动端常用公共样式

@charset "utf-8";
/* 清零 */
*:focus{outline: none;}
html{
    /*禁用iPhone中Safari的字号自动调整*/
    -webkit-text-size-adjust:100%;
    -ms-text-size-adjust:100%;
    /* 解决IOS默认滑动很卡的情况 */
    -webkit-overflow-scrolling : touch;
    font-size: 100px;
    font-size: 26.6666667vw;
}
@media (min-width: 640px) {
    html{
        font-size: 170px;
    }
}
body{font-size: 0.12rem; font-family:'Microsoft YaHei', Tahoma,Arial,"Roboto","Droid Sans","Helvetica Neue","Droid Sans Fallback","STHeiti",sans-serif;}
/*去除iPhone中默认的input样式*/
input{-webkit-appearance:none; resize:none;}
/*取消链接高亮*/
body,div,ul,li,ol,h1,h2,h3,h4,h5,h6,input,textarea,select,select,p,dl,dt,dd,a,img,button,form,table,th,th,tr,th,tbody,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{-webkit-tap-hightlight-color:rgba(0,0,0,0);    -webkit-tap-highlight-color: transparent; margin: 0;padding: 0;border: none; }
/*设置HTML5元素为块级元素*/
article,aside,details,figcaption,figure,footer,hgroup,menu,nav,section{display: block;}
/*图片自适应*/
img{max-width: 100%;height: auto;width:auto; /*IE8*/-ms-interpolation-mode:bicubic;vertical-align: top /*为了照顾IE图片缩放失真*/}


em,i,strong{font-style: normal;}
.clearfix:after{content: "";display: block;visibility: hidden;height: 0; clear: both;}
.clearfix{zoom:1}
a{text-decoration: none;color: #929292;font-family:'Microsoft YaHei', Tahoma,Arial,"Roboto","Droid Sans","Helvetica Neue","Droid Sans Fallback","STHeiti",sans-serif;}
a:hover{color: #929292; text-decoration: none;}
ul,ol,li{list-style: none;}
h1,h2,h3,h4,h5,h6{font-size: 100%; font-family:'Microsoft YaHei', Tahoma,Arial,"Roboto","Droid Sans","Helvetica Neue","Droid Sans Fallback","STHeiti",sans-serif;}
fieldset,img{border: none;}
table{border-collapse: collapse;border-spacing: 0;}
caption,th{text-align: left;}
q:before,q:after{content: "";}
/*禁止表单使用文本框输入法*/
input.password{ime-mode: disabled;}
.scope{max-width: 640px;margin: 0 auto;}
.clear{clear: both;}
/*连续英文，数字换行*/
.wordwrap{word-break: break-all;word-wrap: break-word;}
/*单行文字超出显示省略号*/
.omg{overflow: hidden;text-overflow:ellipsis ;white-space: nowrap;}

*{box-sizing: border-box;}

/* 禁止长按链接与图片弹出菜单 */
a, img {-webkit-touch-callout: none;}
/* 禁止选中文本（如无文本选中需求，此为必选项） */
html, body {-webkit-user-select: none;user-select: none;}

内容总结

以上是互联网集市为您收集整理的Css样式初始化全部内容，希望文章能够帮你解决Css样式初始化所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端