關于html5小知識的分享

次給大家?guī)韍tml5容易被忽略的小知識，html5容易被忽略的小知識有哪些，下面就是實戰(zhàn)案例，一起來看一下。

設置webstorm 輸入內(nèi)容超出屏幕后換行

<hr> 分割線
<br> 換行

2.base標簽:專門用來統(tǒng)一的指定當前的網(wǎng)頁中所有的超鏈接(a標簽)需要如何打開

<base target="_blank">

注意:base標簽必須寫在head標簽的開始標簽和結束標簽之間

3.假連接:點擊后不會跳轉,我們稱之為假鏈接!

1) <a href="#">百度一下,你就知道</a>  #的假鏈接會自動回到網(wǎng)頁的頂部
2) <a href="javascript">百度一下,你就知道</a>  而Javascript的假鏈接不會自動跳轉到網(wǎng)頁頂部

兩者之間的區(qū)別:#的假鏈接會自動回到網(wǎng)頁的頂部,而Javascript的假鏈接不會自動跳轉到網(wǎng)頁頂部.

4.錨點:

要想通過a標簽跳轉到指定的位置,那么必須告訴a標簽一個獨一無二的身份證號碼,這樣a標簽才能在當前界面中找到需要跳轉到的目標位置.

1).給目標位置的標簽添加一個id屬性,然后指定一個獨一無二的值;

2). 告訴a標簽你需要跳轉到的目標標簽對應的獨一無二的省份證號碼是多少.

a標簽 href="#center"<a href="#center"></a>目標標簽里面設置 id="center"<h2 id="center">中部位置</h2>

3).跳轉到新界面的指定位置 href="13-錨點.html#bottom" target="_blank"新界面中打開

原界面中<a href="13-錨點.html#bottom" target="_blank">跳轉到新界面的指定位置</a>目標界面中這樣寫<h2 id="bottom">我是錨點測試界面333333</h2>

5.列表標簽 :

無序列表 >>>  應用場景 : a).新聞列表  b).商品列表  c).導航條

快捷方式 :

ul>li*3<ul>
    <li>北京</li>
    <li>上海</li>
    <li>廣州</li></ul>

有序列表  >>>  應用場景 : 排行榜

<ol>
    <li>演員</li>
    <li>小丑</li>
    <li>龍卷風</li>
    <li>青花瓷</li></ol>

定義列表 >>> 應用場景 : a) . 做網(wǎng)站尾部的相關信息   b) . 做圖文混排

dt dd 中還可以嵌套其他的標簽

快捷方式: dl>(dt+dd)*2<dl>

  <dt>北京</dt>  //definition title 定義標題    <dd>中國的首都</dd>  //definition description 定義描述    <dt>上海</dt>
    <dd>富人的集中地</dd></dl>

6.表格標簽

<!--默認情況下,邊框寬度為0--><table border="1">
    <!--tr:代表整個表格中的一行數(shù)據(jù)-->
    <tr>
        <!--td:代表一行中的一個單元格-->
        <td>姓名</td>
        <td>年齡</td>
        <td>籍貫</td>
    </tr>
    <tr>
        <td>張三</td>
        <td>18</td>
        <td>重慶</td>
    </tr></table>

細線表格

<!--細線表格:在表格上想通過指定外邊距為0來實現(xiàn)細線表格是不靠譜的,其實它是將2條線合并為了一條線,
所以看上去很不舒服,故通過以下方式設置--><!--
1.給table標簽設置bgcolor
2.給tr標簽設置bgcolor
3.給table標簽設置 cellspacing="1px",注意:我設置為1px邊框顯示不出來,設置為2px正常

--><table bgcolor="black" width="200px" cellspacing="2px">
    <tr bgcolor="white" align="center">
        <td>1.1</td>
        <td>1.2</td>
    </tr>
    <tr bgcolor="white" align="center">
        <td>2.1</td>
        <td>2.2</td>
    </tr></table>

caption標簽 >>>專門用來設置table的標題,標題會自動相對于表格的寬度居中

th標簽>>>專門用來設置標題的,會自動居中加粗

td 標簽>>>專門用來存儲數(shù)據(jù)的

<table bgcolor="black" width="800px">    <!--caption : 專門用來設置table的標題,標題會自動相對于表格的寬度居中-->
    <caption>
        <h3>今日小說排行榜</h3>
    </caption>
    <tr bgcolor="#a9a9a9" align="center">
        <!--th : 專門用來設置標題的-->
        <th>排名</th>
        <th>關鍵字</th>
        <th>趨勢</th>
        <th>今日搜索</th>
        <th>最近七日</th>
        <th>先關鏈接</th>
    </tr>
    <tr bgcolor="white" align="center">
        <td>1</td>
        <td>陳二狗的妖孽人生</td>
        <td>上升</td>
        <td>678328</td>
        <td>28378173</td>
        <td>
            <a href="#">今日頭條</a>
            <a href="#">網(wǎng)易新聞</a>
            <a href="#">新浪微博</a>
        </td>
    </tr></table>

相信看了本文案例你已經(jīng)掌握了方法，更多精彩請關注億速云其它相關文章！

以上就是html5容易被忽略的小知識的詳細內(nèi)容，更多請關注億速云其它相關文章！