PHP笔记网

革命尚未成功,同志仍须努力下载JDK17

作者:Albert.Wen  添加时间:2013-03-13 22:57:34  修改时间:2024-11-13 04:37:20  分类:05.前端/Vue/Node.js  编辑

优酷网 reset.css

@charset "utf-8";
/*element*/
html{direction:ltr;*overflow-y:scroll;}
body{height:100%;background:#fff;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,button,select,option,textarea,p,blockquote,th,td{padding:0;margin:0;font:12px/20px arial, helvetica, verdana, tahoma, sans-serif;word-break:break-all;word-wrap:break-word;}
img{border:0;vertical-align:top;}
ol,ul,dl{list-style:none;}
h1{font:bold 16px/18px "microsoft yahei","微软雅黑";}
h2{font-weight:bold;font-size:16px;}
h3{font-weight:bold;font-size:14px;}
h4{font-weight:bold;font-size:12px;}
h5{font-weight:bold;font-size:12px;}
h5{font-weight:bold;font-size:12px;}
h6{font-weight:bold;font-size:12px;}
a{cursor:pointer;color:#014ccc;text-decoration:none;}
a:hover{text-decoration:underline;}
select{height:20px;vertical-align:middle;}
option{height:20px;line-height:20px;padding-right:6px;}
textarea{resize:vertical;}
input{vertical-align:middle;display:inline-block;*display:inline;*zoom:1;height:16px;line-height:16px;_height:auto;_line-height:15px;}
input[type="file"]{height:22px;line-height:20px;}
input[type="radio"],input[type="checkbox"]{padding:1px;margin:-1px 0;}
input[type="button"],input[type="submit"],input[type="reset"]{width:auto;height:22px;line-height:20px;line-height:16px9;padding:0 10px;*padding:0;*width:1;}
input[type="search"]{-webkit-appearance:textfield;}
button,input.btnNormal{vertical-align:middle;height:22px;line-height:18px;padding:0 10px;_line-height:14px;_padding:0;}
@-moz-document url-prefix(){/*for firefox*/input{height:17px;padding-bottom:1px;}} 

 


 

某网站的 global.css

@charset "utf-8";
/* reset */
*{margin:0;padding:0;list-style-type:none;}
a{blr:expression(this.onFocus=this.blur())}/*去掉a标签的虚线框,避免出现奇怪的选中区域*/
:focus{outline:0;}
label{cursor:pointer;}
img{vertical-align:middle;}
table{empty-cells:show;border-collapse:collapse;border-spacing:0;}
h1{font-size:16px;}h2,h3,h4{font-size:14px;}h5,h6{font-size:12px;}
abbr,acronym{border:0;font-variant:normal}
address,caption,cite,code,dfn,em,th,var,optgroup{font-style:normal;font-weight:normal}
input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit}
input,button,textarea,select{*font-size:100%}
a,img{border:0;}
a,a:visited{color:#5e5e5e; text-decoration:none;}
a:hover{color:#4183C4;text-decoration:underline;}
.clear{display:block;overflow:hidden;clear:both;height:0;line-height:0;font-size:0;}
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.clearfix{display:inline-table;}/* Hides from IE-mac */
*html .clearfix{height:1%;}
.clearfix{display:block;}/* End hide from IE-mac */
*+html .clearfix{min-height:1%;}
body{font:12px/180% Arial,Lucida,Verdana,"宋体",Helvetica,sans-serif;color:#333;background:#fff;}
/* shortcut */
.shortcut{position:fixed;top:0;left:0;z-index:9999;width:100%;}
*html,*html body /* 修正IE6振动bug */{background-image:url(about:blank);background-attachment:fixed;}
*html .shortcut{position:absolute;top:expression(eval(document.documentElement.scrollTop));}
.shortcut{height:28px;line-height:28px;font-size:12px;background:#EEEEEE;text-transform:uppercase;box-shadow:1px 0px 2px rgba(0,0,0,0.2);border-bottom:1px solid #DDDDDD;}
.shortcut h1{font-size:14px;font-family:"微软雅黑","宋体";}
.shortcut a,.shortcut h1{padding:0px 10px;letter-spacing:1px;color:#333;text-shadow:0px 1px 1px #fff;display:block;float:left;}
.shortcut a:hover{background:#fff;}
.shortcut span.right{float:right;}
.shortcut span.right a{float:left;display:block;color:#ff6600;font-weight:800;}
.headeline{height:40px;overflow:hidden;}
.adv960x90{width:960px;height:90px;overflow:hidden;border:solid 1px #E6E6E6;margin:40px auto 0 auto;}
.adv728x90{width:728px;height:90px;overflow:hidden;border:solid 1px #E6E6E6;margin:0 auto;}

 


整理、留着、备用:

Html结构

<div class="j-header">
	<div class="j-top"></div>
	<div class="j-nav"></div>
</div>
<div class="j-banner"></div>
<div class="j-body">
	<div class="j-main"></div>
</div>
<div class="j-footer"></div>

CSS

@charset "utf-8";
/*reset*/
body, h1, h2, h3, p, dl, dt, dd, ul, ol, li, button, input, textarea, th, td {margin: 0;padding: 0;}
body {font: 12px/1.2 Arial, "宋体";color: #333;vertical-align: middle;background: #FFF;}
button, input, select, textarea, label {vertical-align: middle;}
img { vertical-align: top;border: none;}
ul, ol {list-style: none;}
a {text-decoration: none;color: #474747;vertical-align: baseline;cursor: pointer;}
a:hover {text-decoration: none;color: #f76f0e;}
table {border-collapse: collapse;border-spacing: 0;}
b, strong {font-weight: normal;}

h1{font:bold 16px/18px "microsoft yahei","微软雅黑";}
h2{font-weight:bold;font-size:16px;}
h3{font-weight:bold;font-size:14px;}
h4{font-weight:bold;font-size:12px;}
h5{font-weight:bold;font-size:12px;}
h5{font-weight:bold;font-size:12px;}
h6{font-weight:bold;font-size:12px;}

select{height:20px;vertical-align:middle;}
option{height:20px;line-height:20px;padding-right:6px;}
textarea{resize:vertical;}

/*清浮*/
.clearfix:after { content:".";display:block;height:0;clear:both;visibility:hidden;}
.clearfix {zoom: 1;}

/*相对定位*/
.pos-r {position: relative;}
.pos-a {position: absolute;}

/*居右、中、左*/
.txt-r {text-align: right;}
.txt-c {text-align: center;}
.txt-l {text-align: left;}

/*垂直居中*/
.txt-m {vertical-align: middle}
.txt-t {vertical-align: top}

/*不换行*/
.txt-nowrap {white-space: nowrap;}

/*强制换行*/
.txt-bw {word-wrap: break-word;word-break: break-all;}

/*浮动*/
.float-l {float: left;}
.float-r {float: right;}

/* 隐藏 */
.hide{display: none!important;}

/*颜色*/
.f-orange {color: #f76f0e!important}
.f-green {color: #68b50d!important}
.f-blue {color: #3355aa!important}
.f-grayc {color: #c1c1c1!important}
.f-gray1 {color: #919191!important}
.f-gray2 {color: #4c4c4c!important}
.f-gray3 {color: #333!important}

/*字体大小*/
.f-12{font-size:12px!important}
.f-14{font-size:14px!important}
.f-16{font-size:16px!important}
.f-18{font-size:18px!important}
.f-20{font-size:20px!important}
.f-22{font-size:22px!important}

/*加粗*/
.f-blod {font-weight: bold}

/*字体*/
.f-yahei{font-family:"Microsoft YaHei"}

/*不透明度*/
.opacity-6{filter: alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.6;background:#000;}
.opacity-8{filter: alpha(opacity=80); -moz-opacity: 0.8; opacity: 0.8;background:#000;}

/*宽度*/
.w1{width:980px;margin-left:auto;margin-right:auto;clear:both;}