2018-6-21 seo達人
如果您想訂閱本博客內容，每天自動發到您的郵箱中， 請點這里
基本格式：
<！DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html； charset=utf-8">
<title>制作我的第一個網頁</title>
<style type="text/css">
h1{font-size；color；text-align：center}
</style>
</head>
<body>
<h1>Hello World！ </h1>
</body>
</html>
注釋：<！--注釋文本-->
強調語氣：<strong>，<em>：前者實現加粗再加粗，后者實現加粗加斜 體。
<span>標簽：寫在style 里設置單獨樣式。
<q></q>標簽：引用簡短文本，使引用的詩句等自己出現雙引號。
<blockquote>： 引用長文本，增加縮進量。
<br />： 換行標簽。
：代碼之間實現空格。
<hr />： 段落之間分隔的橫線。
<address>： 定義一個地址（比如電子郵件地址） ，簽名或者文檔的作者身份。在瀏覽器上顯示的樣式為斜體。
<code>： 加入簡短代碼。
<pre>： 加入一段長代碼。
Ul-li標簽： 添加新聞信息列表， 圖片列表， 無序文字列表。
Ol-li 標簽：添加有序列表，與ul-li 標簽類似。
<div> ：把一些獨立的邏輯部分劃分出來，形成欄目板塊。其中還可使用
<div id=” “>給板塊命名。
<table>： 制作表格。
用CSS 樣式為表格添加邊框：<style type=”text/css”>
黑色邊框： table tr td，th{border：1px solid #000；}</style>
<caption>：為表格添加標題和摘要。 <table summary=’’”表格簡介文本”>
<caption>標題文本</caption> </table>
<a>： 實現超鏈接。<a href=”目標網址” title=“鼠標滑過顯示的文本”>鏈接顯示的文本</a> 默認在當前瀏覽器窗口打開，添加“target—blank ”在新的瀏覽器窗口打開。
<mailto>： 在網頁中鏈接Email 地址。 <a href=”mailto： yy@qq。com ?
Cc（抄送地址）=zsq@qq。com & bcc（密件抄送地址）=zjj@qq。com &
subject=”主題” & body=“郵件內容”>發送</a> 給多個收件人發送，用分號隔開。第一個參數用？開頭，之后用 &隔開。
<img>： 添加圖片。Src=”標識圖像的位置。” alt=”指定圖像的描述性文本，當圖像不可見時（下載不成功時），可看到該屬性指定的文本”
Title=“提供在圖像可見時對圖像的描述（鼠標滑過圖片時顯示的文本）”
<form>： 表單標簽，與用戶交互使得瀏覽器可以處理用戶的數據。
<form method=”數據傳送的方式（get/post）action=”瀏覽器輸入的數據被傳送到的地方，如一個 PHP 頁面（save。php）””
<label for="username">用戶名：</label>
<input type="text" name="username" id="username" value="" />
<label for="pass">密碼：</label>
<input type="password" name="pass" id="pass" value="" /> 瀏覽器顯示： 用戶名： 肯定存，啊 密碼：
表單文本輸入框，密碼輸入框：<form><input type=”text/password”
name=”名稱（以備后臺使用）” value=“文本（設置默認值，提示作用）”>
文本域的多行輸入：<textarearows（height）=”行數” cols（width）
=”列數”>文本</textarea>
單選框，復選框：<input type=”radio（單選框）/checkbox（復選框）”
value=” 值 ” name=” 名 稱 ” checked= “ checked ” /> 當 設 置
checked=”checked”時，該選項被默認選中。同一組按鈕，name 取值必須相同。
下拉列表框<select>：<label> XX </label>
<select>
<option value=”讀書” selected=”selected（被默認選中）”>讀書</option></select>
提交按鈕 submit：<input type=”submit” value=”提交”>重置按鈕 reset：<input type=”reset” value=”重置”>
<label>：<label for=”控件id 名稱”>慢跑 </label>
<input type=”checkbox” name=”gender” id=”jogging” />
for 屬性的值與id 屬性值一定要相同。
Placeholder：<input type=”email” id=”email” placeholder=”Enter email”>該提示會在輸入字段為空時顯示，并會在字段獲得焦點時消失。
CSS 樣式：定義文本的顯示樣式，如字體大?。?span style="box-sizing:border-box;outline:0px;word-break:break-all;color:#9BBA58;">font-size），顏色（color），加粗（font-weight：bold）等。
注釋語句：/*注釋語句*/。
內聯式 CSS 樣式：<p style=”color：red ； font-size：12px”>紅色字體</p>
嵌入式 CSS 樣式：<style type=”text/css”>span{ }</style>
外部式 CSS 樣式：在head 里寫：<link href=”XX。css” rel=”stylesheet”
type=”text/css”>，在XX。css 里寫：span{ }
三種方式的優先級：相同權值下，內聯式 >嵌入式 >外部式。但是，嵌入式 >外部式的前提為嵌入式的位置一定在外部式的后面。
選擇器：每一條CSS 樣式定義由兩部分組成：選擇器{樣式；}
標簽選擇器：如<html>，<body>，<h1>，<img>，<p font，，>。
類選擇器：。類選擇名稱（可任意起名，。XX）{css 樣式代碼；} -> <span class=”XX”></span>
ID 選擇器：#類選擇名稱（可任意，#XX）{css 樣式代碼；} -><span
id=”XX”></span>只能在文檔中使用一次。
“>”子選擇器：用于選擇指定標簽元素的第一代子元素?！局苯雍蟠?span style="box-sizing:border-box;outline:0px;word-break:break-all;font-family:宋體;">】 first>span{border：1px solid red；} <span>我還是一個<span>膽小如鼠</span>的小女孩</span>
包含（后代）選擇器：加入空格，用于選擇指定標簽元素下的后輩元素?！舅凶雍蟠亍?/span>
通用選擇器：由一個*指定，匹配html 中所有標簽元素。在style 里：
*{color：red；}
偽類選擇符 “ ：hover”：它允許給html 不存在的標簽（標簽的某種狀態）設置樣式。 a：hover{color：red；}鼠標滑過時字體變為紅色。
分組選擇符 “ ，”：為多個標簽元素設置同一個樣式。 如h1，p{ }。
繼承：有些樣式具有繼承性如color，有些不具有如border。具有繼承性的允許樣式不僅應用于某個特定 html 標簽元素，而且應用于其后代。
權值：標簽的權值為1，類選擇符的權值為10，ID 選擇符的權值最高為 100。
p{color：red；} /*權值為1*/
p span{color：green；} /*權值為1+1=2*/
。warning{color：white；} /*權值為10*/
p span。warning{color：purple；} /*權值為1+1+10=12*/
#footer 。note p{color：yellow；} /*權值為100+10+1=111*/ 特殊性：繼承也有權值，但是只有0。1 。
層疊：當有相同權重值時，后面的樣式會覆蓋前面的樣式。
重要性 ！important ：p{color：red！important；}這時p 段落中的文本會顯示紅色。！important 要寫在分號前面。
藍藍設計( www.shtzxx.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務