網頁課程內容回顧(HTML),課程內容回顧

來源:互聯網
上載者:User

網頁課程內容回顧(HTML),課程內容回顧

今天和大家分享我這段時間以來學習html的總結,以此來鞏固,也希望對初學者能有所協助。

開發工具:Sublime Text2HBuilder

首先學習的當然是html的標籤語言,其實w3cschool中都有。

<meta> 元素可提供有關頁面的元資訊(meta-information),比如針對搜尋引擎和更新頻度的描述和關鍵詞       <meta charset="UIF-8">       <meta name="keyword" content="html5,css3">       <meta name="author" content="whqet">       <meta name="generater" content="sublime taxt2"> 
<title> 網頁標題       <title>Document</title>
<style> 指定標籤的行內樣式,頁面內部的css       <style>            p{             font-size: 12px; 字型大小             font-weight:bold; 字型變粗             font-style:italic; 字型變斜             color:red; 字型顏色             text-indent: 2em; 首行縮排             line-height: 1.5em; 行高            }       </style>
<link> 連結外部的css       <link rel="shortcut icon" type="image/x-icon" herf="favicon.ico">
<script>指令碼,頁內的指令碼,連結外部的js        <script>              var a="hello world";              alert(a);        </script>        <script src="1.js"></script>        <script type="text/javascript"></script>        document.write("<h1>Hello World!</h1>")        </script>
        <body> 顯示網頁裡面的內容        <body>          網頁內容        </body>
ol, ordered List (數字) 定義有序列表ul, unordered List (小圓點) 定義無序列表                                                                                           li, list item   <ol style="list-style-type:lower-alpha"> a,b,c   <ul style="list-style-type:square"> 小方塊     ol:        decimal 1阿拉伯數字(預設)        lower-alpha a英文小寫        upper-alpha A英文大寫        lower-roman i羅馬小寫數字        upper-roman I羅馬大寫數字     ul:        sc 實心圓(預設)        circle 空心圓        square 實心正方形        none 不顯示任何標記
普通連結        普通連結最重要的兩個屬性,href指定連結地址,target指定方式開啟        <a href="<a target=_blank href="http://www.baidu.com">http://www.baidu.com</a>" target="-blank">百度一下</a>        <a href="<a target=_blank href="http://www.w3cschool.com.cn/">http://www.w3cschool.com.cn/</a>" target="-blank">使用w3cschool學習網頁</a>        郵件連結        郵件連結可以調用本地的郵件用戶端發送郵件,用的不多(現在一般用網頁方式發送郵件)        <a href="<a target=_blank href="mailto:whqet@qq.com?subject=Hello%20again">mailto:whqet@qq.com?subject=Hello%20again</a>">給慶哥發個郵件</a>        頁內連結,建立一個在網頁內部的導航        步驟:1、建立目標     <a name="abc"> </a>              2、跳轉到該頁   <a href="#abc"> </a>        菜單架構        我們經常使用ul、li、a的方式事件菜單        <ul>          <li><a href="#abc">ASP</a></li>          <li><a href="#abc">PHP</a></li>          <li><a href="#abc">JSP</a></li>          <li><a href="#abc">DELPHI</a></li>          <li><a href="#abc">VS</a></li>          <li><a href="#abc">AJAX</a></li>          <li><a href="#abc">JQUERY</a></li>        </ul>
<table>標籤定義HTML表格        簡單的HTML表格由table元素以及一個或多個tr、th或td元素組成。        tr元素定義表格行,th元素定義表頭,td元素定義表格單元。        更複雜的HTML表格也可能包括caption、col、colgroup、thead、tfoot以及tbody元素。        col,  column     列,欄目,通常表示一個列        row,  row        行,通常表示一個行        span              跨度               span       標籤,行內的容器               colspan    td的屬性,該td跨列數        cell              細胞,單間,儲存格        space             空格        spacing           空間,間隔               cellspacing 儲存格間隔        padding           填充               cellpadding 儲存格的內填充        <table border="1">        <caption>資訊表</caption>        <tr>            <th>姓名</th>            <th>性別</th>            <th>年齡</th>        </tr>        <tr>            <td>張三</td>            <td>男</td>            <td>30</td>        </tr>         <tr>            <td>李四</td>            <td>男</td>            <td>45</td>        </tr>        <tr>            <td>李倩</td>            <td>女</td>            <td>18</td>        </tr>        <tr>            <td colspan="3">有些屬實,有些瞎編</td>        </tr>        </table>                                                                                                                       <img src="http://img.blog.csdn.net/20150328143849037?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvSEVSTzA2MDc=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" />
<figure> 標籤規定獨立的流內容(映像、圖表、照片、代碼等等)。       <figure>        <figcaption>映像標題</figcaption>        <img src="abcd.jpg" width="350" height="234" alt="" usemap="#abc">       </figure>   使用<map>標籤定義地圖,<map裡>面使用<area>標籤定義熱區        area裡面的shape        shape="circle" coords="x,y,r"地區為圓形 圓心座標和半徑        shape="polygon" coords="x1,y1,x2,y2,x3,y3,..."地區為多邊形  多邊形所有頂點的座標        shape="rectangle" coords="x1,y1,x2,y2"地區為矩形  矩形的左上右下兩點的座標                                                    熱區連結在<img>標籤裡面使用<usemap>屬性調用<map>      <map name="#abc">       <area shape="circle" coords="95,115,80" href="<a target=_blank href="http://www.baidu.com">http://www.baidu.com</a>" alt="">       <area shape="polygon" coords="183,110,200,110,200,90,213,90,217,110,237,110" href="<a target=_blank href="http://www.csdn.net">http://www.csdn.net</a>" alt="">       <area shape="rectangle" coords="502,48,613,185" href="<a target=_blank href="http://www.sohu.com">http://www.sohu.com</a>" alt="">      </map>



聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: 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

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

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

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.