HTML-基礎知識

 

目錄

一、排版標籤

二、字體標籤

三、圖像標記

               代表一副圖片

四、清單標記

      無序列表 

      有序列表   

      定義列表 

五、超鏈接

六、表格標記

               表格

               

七、框架標記

八、表單標記及語義化

九、多媒體標記

十、頭標記

十一、其他

 

 


一、排版標籤

     <p>    代表一個段落

              屬性:

                     align:對齊方式    ——   取值:left,right,center

    <br>    換行

    <hr>    表示一根線

              屬性:

                     color : 顏色            

                    size: 線的粗細            

                   width:線的長短(1.絕對值:500  or  2.相對值:50% )

                   noshade : 不要陰影

                  align : 對齊方式

    <pre>   預定義格式標籤。  作用:告訴瀏覽器不要忽略空格和空行

   <div>    塊級標籤,

   <span>   不換行,字體標記

 

二、字體標籤

  <h1> ~~~ <h6>     定義字體大小

             屬性:

                   align: 居中

  <b>     加粗

  <strong>     加粗

  <i>      斜體

  <em>   斜體

  <u>    下劃線

  <s>    中劃線(刪除線)

  <sup>  上標

  <sub>  下標


三、圖像標記

    <img>    代表一副圖片

                  屬性:

                         src : 圖片路徑(相對路徑 / 絕對路徑)

                        alt : 當圖片加載失敗時 代替圖片顯示的內容

                         width :  寬度

                        height : 高度

                       title : 提示性文本

                      border : 邊框

 

四、清單標記

       無序列表  <ul>

               屬性:

                      type :  disc(默認,實心圓點)   |    square(實心方點)   |   circle(空心圓)

      有序列表   <ol>

              屬性:

                    type :  按什麼開始,如: 1,a,A,i,I

      定義列表  <dl>

             <dt>:列表項的標題

             <dd>: 列表項

 

五、超鏈接

        1. 鏈接到其他頁面    <a href = "www.baidu.com">百度一下</a>

        2.錨鏈接 : 利用別的標籤的 ID , 

                        如 <p id="to_me">到我這裏</p>    <a href="#to_me">點我到p</a>

        屬性:

                target :  告訴瀏覽器怎麼顯示目標鏈接頁面

                             _self :在同一個瀏覽器中顯示

                             _blank : 打開新的瀏覽器顯示

                             _parent :

                             _top :

 

六、表格標記

      <table>     表格

                  屬性:

                          border : 邊框

                          width : 寬度

                         align : 表格的對其方式

                         cellpadding : 單元格內容到邊的距離

                         cellspacing : 單元格到單元格之間的距離

                         bacolor: 背景顏色

                         background : 背景圖片

       <tr>     行

       <td>     單元格

                  屬性:

                         align : 內容的橫向對齊方式

                         valign : 內容的縱向對齊方式   top , middle , bottom

                        width :  絕對值 或者 相對值 (%)

                        height : 單元格的高度

       <th>     相當於<td>+<b> 屬性同  <td>

 

七、框架標記

      <iframe>         

  注意: 框架頁面上不允許有body標籤

                    scrolling :是否需要滾動條。默認是true   

                    norsesize :固定框架的大小      

                    bordercolor  :  給邊框起一個顏色

                    name : 給框架起一個名字

 

八、表單標記及語義化

    <input>

           屬性:

                   type : 

                           text:普通框

                          password:密碼框

                          hidden:隱藏框

                             (當type等於上面三個時, 它們共有的其他屬性  ,如 <input type="text" value="username"   readonly  >)

                                       value值.

                                       size

                                      readonly  :  只能讀不能輸入

                                      disabled  :  直接不能點進去

                        radio : 選擇框

                                      checked  :  默認選中

                                      value : 值.

                                      name 

                       checkbox  : 多選框

                                      value

                                      name

                                     checked : 默認選中

                      botton : 普通按鈕

                      submit : 提交按鈕

                      reset :重置按鈕

                      image  :圖片按鈕(也帶有提交功能)

    <select>:下拉選擇框

                       mutiple :允許按住 shift 進行多選操作

                      name 

   <option> :  下拉選項框的具體內容

                      value : 值

    <textarea>  : 大文本

                      row : 列像素

                      cols :行像素

 

九、多媒體標記

    b...gsound:背景音樂

    embed:voide:播放多媒體文件

    marquee:移動

        屬性:  

            direction:移動方向。left,right,up,down,

            behavior:行爲方式 取值: slide,alternate,scroll

            loop:循環多少次,負數代表無限循環

            scrolldelay:移動一次休息多長時間。單位是毫秒

 

十、頭標記

<meat>    

            <meta      http-equiv = "refresh"      content = "3 ;   url=https://daohang.qq.com/?fr=hmpage  " >

                      刷新:表示3秒後跳到後面網頁

 

十一、其他

     body
        bgcolor
        background
        text   表示標籤裏的全部字體顏色
        link   點之前顏色
        alink 鼠標點的顏色
        vlink 鼠標點之後的顏色

       background :背景圖片

    label
        表示給一個字加上標籤。

CSS


引用文件:<link rel="stylesheet" type="text/css" href="css的文件路徑">

優先順序:從上到下,從內到外。後加載的優先級要高

定位:relative  會使DIV漂浮 通過top left righr bottom
但是 它原來的位置不會被別的DIV 補上(不會把對象從文檔流中拖出)
    而absolute 正好相反

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章