整合營銷服務商

          電腦端+手機端+微信端=數據同步管理

          免費咨詢熱線:

          5.HTML格式標簽

          .br 強制換行標簽

          讓后面的文字、圖片、表格等等,顯示在下一行




          碼海無際<br>碼海無際

          2.p 換段落標簽

          在網頁中要把文字有條理地顯示出來,離不開段落標簽,就如同我們平常寫文章一樣,整個網頁也可以分為若干個段落,而段落的標簽就是



          <p>碼海無際</p><p>碼海無際</p>

          3.hr 水平分割線標簽

          在網頁中常??吹揭恍┧骄€將段落與段落之間隔開,使得文檔結構清晰,層次分明。這些水平線可以通過插入圖片實現,也可以簡單地通過標簽來完成,hr 就是創建橫跨網頁水平線的標簽。




          碼海無際<hr>碼海無際

          4.div 分區顯示標簽

          分區顯示標簽,也稱之為層標簽,常用來編排一大段的HTML段落,也可以用于格式化表,和 p 很相似,是塊狀元素,經常嵌套使用。







          <div>碼海無際</div><div>碼海無際</div><div>  <div>碼海無際</div>  <div>碼海無際</div></div>

          5.span 行內標簽

          用來組合文檔中的行內元素,沒有固定的格式表現。當對它應用樣式時,它才會產生視覺上的變化。



          <span>碼海無際</span><span>碼海無際</span>

          6.pre 預格式化標簽

          pre 元素可定義預格式化的文本。被包圍在 pre 元素中的文本通常會保留空格和換行符。而文本也會呈現為等寬字體。





          <pre>  碼海無際  碼海無際</pre>

          7.ul 無序列表標簽

          無序列表的各個列表項之間沒有順序級別之分,是并列的。






          <ul>  <li>碼海無際</li>  <li>碼海無際</li>  <li>碼海無際</li></ul>

          注意:




           1. <ul></ul>中只能嵌套<li></li>,直接在<ul></ul>標簽中輸入其他標簽或者文字的做法是不被允許的。 2. <li>與</li>之間相當于一個容器,可以容納所有元素。 3. 無序列表會帶有自己樣式屬性,但是不推薦使用,一般會用CSS設置。

          8.ol 有序列表標簽

          有序列表即為有排列順序的列表,其各個列表項按照一定的順序排列定義

          1.格式:





          <ol type="符號類型">    <li type="符號類型"></li>    <li type="符號類型"></li></ol>

          2.有序列表的type屬性值:

          • 1:阿拉伯數字1.2.3等等,默認type屬性值
          • A:大小字母A、B、C等等
          • a:小寫字母a、b、c等等
          • Ⅰ:大寫羅馬數字Ⅰ、Ⅱ、Ⅲ、Ⅳ等等
          • ?。盒懥_馬數字ⅰ、ⅱ、ⅲ、ⅳ等等

          3.有序列表的value屬性值:

          • 指定一個新的序列數字起始值

          4.列表可以進行嵌套







































          <ol>  <li>碼海無際</li>  <li>碼海無際</li>  <li>碼海無際</li></ol><hr><ol type="A">  <li>碼海無際</li>  <li>碼海無際</li>  <li>碼海無際</li></ol><hr><ol>  <li>碼海無際</li>  <li type="A">碼海無際</li>  <li>碼海無際</li></ol><hr><ol>  <li>碼海無際</li>  <li>碼海無際</li>  <li value="6" type="A">碼海無際</li>  <li>碼海無際</li>  <li>碼海無際</li></ol><hr><ol>  <li>碼海無際</li>  <li>碼海無際</li>  <li>    <ol type="A">      <li>志存高遠</li>      <li>志存高遠</li>    </ol>  </li>  <li>碼海無際</li>  <li>碼海無際</li></ol>

          9.dl 自定義型列表標簽

          對列表條目進行簡短的說明







          <dl>  <dt>軟件說明:</dt>  <dd>這是軟件說明</dd>  <dt>軟件界面:</dt>  <dd>這是軟軟件界面</dd></dl>

          10.center 居中對齊標簽

          居中對齊


          <center>碼海無際</center>

          TML是誰發明的?

          1.HTML的全稱是什么?

          超文本標記語言(Hyper Text Markup Language),是一種用于創建網頁的標準標記語言。

          2.誰發明的?

          是由Tim Berners-Lee發明的。

          HTML 起手應該寫什么?

          <!DOCTYPE html>
            <!--文檔類型為html 此行必須為第一行 前面空一行也會報錯-->
            <html lang="en">
              <!--html標簽 en是英語 zh-CN是中文-->
              
              <head>
                           <meta charset="UTF-8">
                             <!--文件的字符編碼-->
                             <meta name="viewport" content="width=device-width, initial-scale=1.0">
                               <!--content里的內容代表禁止縮放,兼容手機-->
                               <meta http-equiv="X-UA-Compatible" content="ie=edge">
                                 <!--content里的內容表示讓ie使用最新的內容-->
                                 <title>Document</title>
              </head>

          常用的表章節的標簽有哪些,分別是什么意思?

          1. h1-h6 標題
          2. section 章節
          3. article 文章
          4. p 段落
          5. header 頭部
          6. footer 腳部
          7. main 主要內容
          8. aside 旁支內容
          9. div 劃分,表示一個區塊

          全局屬性有哪些?

          1. class 用來對網頁元素進行分類。如果不同元素的class屬性值相同,就表示它們是一類的。
          2. contentteditable HTML 網頁的內容默認是用戶不能編輯,contenteditable屬性允許用戶修改內容。
          3. hidden hidden是一個布爾屬性,表示當前的網頁元素不再跟頁面相關,因此瀏覽器不會渲染這個元素,所以就不會在網頁中看到它。
          4. id id屬性是元素在網頁內的唯一標識符
          5. style 用來指定當前元素的 CSS 樣式
          6. tabindex 頁通常使用鼠標操作,但是某些情況下,用戶可能希望使用鍵盤,或者只有鍵盤可以用。因此,瀏覽器允許使用 Tab 鍵,遍歷網頁元素。也就是說,只要不停地按下按鈕 Tab 鍵,網頁的焦點就會從一個元素轉移到另一個元素,選定焦點元素以后,就可以進行下一步操作,比如按下回車鍵訪問某個鏈接,或者直接在某個輸入框輸入文字。
          7. title 用來為元素添加附加說明。大多數瀏覽器中,鼠標懸浮在元素上面時,會將title屬性值作為浮動提示,顯示出來。

          常用的內容標簽有哪些,分別是什么意思?

          1. ol+li 有序列表
          2. ul+li 無序列表
          3. dl+dt+dd 自定義的列表
          4. pre 顯示文本中的空白符號
          5. hr 分割線
          6. br 換行
          7. a 鏈接通過<a>標簽表示,用戶點擊后,瀏覽器會跳轉到指定的網址。
          8. em <em>是一個行內標簽,表示強調(emphasize),瀏覽器會以斜體顯示它包含的內容。
          9. strong <strong>是一個行內元素,表示它包含的內容具有很強的重要性,需要引起注意。瀏覽器會以粗體顯示內容。
          10. code 呈現一段計算機的代碼,各類語言。
          11. quote 行內的引用
          12. blockquote 塊的引用

          HTML文件中,有些標簽會被經常用到,可能有人覺得太基礎,就不認真對待,但是我可以負責任的告訴你,越基礎的往往越重要。這次重點學一學標題、段落和鏈接等基礎標簽。

          為了不重復粘貼HTML代碼,咱們來個約定,除了第一次出現完整的HTML文件的頁面結構之外,之后只現新增的標簽內容,你自己將新的內容,添加到HTML文件中,進行效果驗證。

          <!DOCTYPE html>
          <html>
          <head>
              <meta charset="UTF-8">
              <title>第3個HTML文件</title>
          </head>
          <body>
          <!--這是一個完整的HTML頁面結構,常用標簽放在這個注釋后面即可-->
          </body>
          </html>

          3.1 標題<h1>~

          在HTML中,標題從一級到六級,對應標簽為<h1>到<h6>,字體逐步變小。屬性為align(對齊方式),屬性值為left(左對齊,默認)、right(右對齊)和center(居中對齊)。

          <h1 align="center">一級標題</h1>
          <h2 align="center">二級標題</h2>
          <h3>三級標題</h3>
          <h4 align="left">四級標題</h4>
          <h5 align="right">五級標題</h5>
          <h6 align="right">六級標題</h6>

          輸出結果


          3.2 段落<p>

          <p> 標簽定義段落。瀏覽器解析到<p>標簽時,會自動在其前后創建一些空白。<p>標簽的屬性也是align。其實為了HTML文件統一布局,很少會用align來指定位置,大多數是用CSS統一指定。

          <p>老陳說編程,除了說編程,</p>
          <p>還有程序員的愛情與友情,</p>
          <p>那是不可能的。</p>

          輸出結果


          3.3 水平線和換行

          在網頁發的文字多時,好多人習慣性會使用分割線。在HTML,用<hr/>單標簽就可以實現分割線。而換行,則用<br/>標簽。<hr>標簽屬性有表示位置的align、高度的的size和寬度width三個屬性,其中size和width的單位是像素,但如果用到這些屬性的話,推薦用CSS。

          <hr size="1"/>
          小舅子要結婚了,丈母娘跟我借了10萬塊錢做彩禮,結果婚事談崩了。<br/>
          今天公司急用錢,我向丈母娘要那10萬塊錢。<br/>
          丈母娘說:借你這10萬塊錢是干啥用的?<br/>
          我說:給小舅子結婚用??!<br/>
          丈母娘說:那婚結成了嗎?<br/>
          我說:沒結成。<br/>
          丈母娘大聲罵道:婚都沒結成你還有臉來要錢!<br/>
          突然感覺丈母娘這話說的沒什么毛病??!
          <hr size="1"/>

          輸出結果

          3.4 列表<ul>和<ol>

          無序列表<ul>標簽,可用粗體圓點標記一個項目的列表;有序列表<ol>標簽使用數字進行標記,而列表項用<li>標簽實現。有關列表的屬性,不是被H5拋棄,就是不被推薦,所以......。

          <p>
              程序員最喜歡做的三件事
          <ul>
              <li>編程</li>
              <li>開發</li>
              <li>敲代碼</li>
          </ul>
          程序員最喜歡的三個美女
          <ol>
              <li>潘金蓮</li>
              <li>楊貴妃</li>
              <li>楊八妹</li>
          </ol>
          </p>

          輸出結果

          3.5 超鏈接<a>

          <a>標簽定義超鏈接,用于從一個頁面鏈接到另一個頁面。最重要的屬性是 href和target, href指定鏈接的目標(網頁地址),target指定打開窗口的模式,_blank:打開新窗口,_parent:在父窗口中打開,_self:默認,當前頁面跳轉,_top:在當前窗體打開鏈接,并替換當前的整個窗體。

          在沒點擊鏈接之前,你先看一下鏈接內容的字體顏色,點擊鏈接之后,你再看一下,你就會發現,鏈接內容的顏色會有所變化。

          (1) 未被訪問的鏈接帶有下劃線而且是藍色的;

          (2) 已被訪問的鏈接帶有下劃線而且是紫色的;

          (3) 活動鏈接帶有下劃線而且是紅色的。

          <a href="demo1.html">去到老陳說HTML的第1個Demo中</a>

          輸出結果


          好了,有關html基礎標簽的內容,老陳講完了,如果覺得對你有所幫助,希望老鐵能轉發點贊,讓更多的人看到這篇文章。你的轉發和點贊,就是對老陳繼續創作和分享最大的鼓勵。

          一個當了10年技術總監的老家伙,分享多年的編程經驗。想學編程的朋友,可關注:老陳說編程。分享Python,前端(小程序)、App和嵌入式方面的干貨。關注我,沒錯的。

          #前端##HTML##程序員##編程##CSS#


          主站蜘蛛池模板: 男人的天堂亚洲一区二区三区| 日韩福利视频一区| 日韩电影一区二区三区| 精品人体无码一区二区三区| 上原亚衣一区二区在线观看| 国产精品女同一区二区| 91成人爽a毛片一区二区| 亚洲熟女综合色一区二区三区| 久久精品成人一区二区三区 | 波多野结衣电影区一区二区三区| 国产成人无码一区二区在线观看| 日本一区二区三区精品中文字幕| 精品动漫一区二区无遮挡| 福利一区在线视频| 91精品福利一区二区三区野战| 国产精品一区不卡| 亚洲国产成人久久综合一区| 高清无码一区二区在线观看吞精| 无码人妻精品一区二区三18禁| 波多野结衣一区二区三区高清在线 | 免费看无码自慰一区二区| 久久久精品人妻一区亚美研究所 | 中文字幕精品一区二区| 国产在线一区观看| 美女啪啪一区二区三区| 国偷自产一区二区免费视频| 东京热人妻无码一区二区av| 无码国产精品久久一区免费| 国模无码视频一区| 深夜福利一区二区| 精品无码人妻一区二区三区18| 久久99国产精品一区二区| 97久久精品午夜一区二区| 一区三区三区不卡| 日韩人妻无码一区二区三区| 无码精品人妻一区| 一区二区三区免费在线视频| 一区二区三区视频| 国产女人乱人伦精品一区二区 | 中文精品一区二区三区四区| 国产精品无码一区二区在线 |