html5容易被忽略的小知識

設置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"<h1 id="center">中部位置</h1>

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

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

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>
 <h2>今日小說排行榜</h2>
 </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)掌握了方法，更多精彩請關注Gxl網(wǎng)其它相關文章！

推薦閱讀：

怎樣添加帶提示功能的代碼塊

常用的WebStorm快捷鍵

驗證國內(nèi)手機號與座機號的正則表達式

JS關于作用域的一個問題

聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權等問題請及時與本網(wǎng)聯(lián)系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com