分享下自寫的HTML CSS規範

最後更新：2018-12-06 來源：互聯網

上載者：User

創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

最近比較忙，暫時沒法斷續整理前端開發規範文檔啦！自認為內容詳盡豐富，待需數日再分享給各們同聊們啦！今先把XHTML CSS簡單代碼大致規範分享下。如有疑問請留言，或等待後續詳盡文檔的發布!便知曉！

===XHTML大致規範===

<!DOCTYPE html>
<head>
<meta charset="utf-8" />
<meta name="author" content="龐淦...">
<meta name="keywords" content="關鍵字...">
<meta name="description" content="網站描述...">
<meta name="robots" content="all" />
<title>深圳市美賽達科技有限公司</title>
<link rel="stylesheet" href="style/public.css" />
<script src="scripts/jquery-1.4.2.min.js"></script>
</head>
<body>

<div id="wraper">

<div id="header">

</div>


    <div id="contents" class="clearall">

    <div class="sidebar fl">

</div>


<div class="mainbar fr">

</div>

    </div>


    <div id="footer">

    </div>

</div>

<script src="Scripts/public.js"></script>
</body>
</html>

===CSS public.css檔案大致規範（除了CSS Reset外，其它都為項目中的公用樣式隨自身項目而添加修改）===

@charset "utf-8";
/*================================================
Version:6.0 Date:2010/10/21
Rendering Engine:Trident,Gecko,WebKit,Presto.
Author:PangGan E-mail:xinzu86@163.com QQ:329784240
================================================*/
/*CSS Reset*/
html,body,h1,h2,h3,h4,h5,h6,p,br,form,input,button,textarea,select,fieldset,blockquote,ul,ol,li,dl,dt,dd,pre{margin:0;padding:0;}
body{font:12px/1.231 Tahoma,Helvetica,Arial,"\5b8b\4f53",sans-serif;color:#333;}
h1,h2,h3,h4,h5,h6{font-size:14px;font-weight:bold;}
a{color:#333;text-decoration:none;outline:none;}
a:hover{color:#23930c;text-decoration:underline;}
textarea,select,input,button,label{vertical-align:middle;font-size:12px;}
button{background:none;border:none;cursor:pointer}
address,cite,code,em,var,abbr,acronym{font-style:normal;}
pre{font-size:12px;text-align:center;white-space:pre-wrap;word-wrap: break-word;}
table{border-collapse:collapse;table-layout:fixed}
td,th{word-wrap:break-word;word-break:break-all;overflow:hidden;}
ol,ul{list-style:none;}
li{list-style-position:outside}
img{border:none;}
/*clear float*/
.clearfix{clear:both;height:1%;display:table;display:inline-block;}
.clearall{overflow:hidden;_zoom:1;}
.clear{clear:both;font-size:0;height:0;line-height:0;}
/*CSS float*/
.fl{float:left;display:inline;}
.fr{float:right;display:inline;}
/*CSS align*/
.ta_l{text-align:left}
.ta_r{text-align:right}
.ta_c{text-align:center}
.ta_j{text-align:justify}
/*CSS margin*/
.mt_10{margin-top:10px;}
.mr_10{margin-right:10px;}
.mb_5{margin-bottom:5px;}
.ml_8{margin-left:8px;}
/*CSS padding*/
.pt_10{padding-top:10px;}
.pr_15{padding-right:15px;}
.pb_5{padding-bottom:5px;}
.pl_8{padding-left:8px;}
/*CSS border*/
.b_4{border:1px solid #666;}
.b_4_red{border:1px solid red;}
/*CSS font-size*/
.fz_12{font-size:12px;}
.fz_14{font-size:14px;}
.fz_16{font-size:16px;}
.fz_18{font-size:18px;}
/*CSS fontColor*/
.f_blue{color:blue;}
.f_white{color:white;}
.f_666{color:#666;}
.f_09c{color:#09c}
/*CSS backgroundColor*/
.bg_blue{background:blue;}
.bg_white{background:white;}
.bg_666{background:#666;}
.bg_09c{background:#09c}
/*CSS public page*/
#wraper{width:960px;margin:0 auto;}/*頁面地區*/
#header{}/*頁首*/
h1 a{display:block;text-indent:-1000px;}/*logo*/
#nav{}/*導航*/
#contents{}/*頁主體*/
.sidebar{}/*側欄*/
.mainbar{}/*主欄*/
#footer{}/*頁尾*/
.copyright{}/*著作權*/

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More