讓后面的文字、圖片、表格等等,顯示在下一行
碼海無際<br>碼海無際
在網頁中要把文字有條理地顯示出來,離不開段落標簽,就如同我們平常寫文章一樣,整個網頁也可以分為若干個段落,而段落的標簽就是
<p>碼海無際</p><p>碼海無際</p>
在網頁中常??吹揭恍┧骄€將段落與段落之間隔開,使得文檔結構清晰,層次分明。這些水平線可以通過插入圖片實現,也可以簡單地通過標簽來完成,hr 就是創建橫跨網頁水平線的標簽。
碼海無際<hr>碼海無際
分區顯示標簽,也稱之為層標簽,常用來編排一大段的HTML段落,也可以用于格式化表,和 p 很相似,是塊狀元素,經常嵌套使用。
<div>碼海無際</div><div>碼海無際</div><div> <div>碼海無際</div> <div>碼海無際</div></div>
用來組合文檔中的行內元素,沒有固定的格式表現。當對它應用樣式時,它才會產生視覺上的變化。
<span>碼海無際</span><span>碼海無際</span>
pre 元素可定義預格式化的文本。被包圍在 pre 元素中的文本通常會保留空格和換行符。而文本也會呈現為等寬字體。
<pre> 碼海無際 碼海無際</pre>
無序列表的各個列表項之間沒有順序級別之分,是并列的。
<ul> <li>碼海無際</li> <li>碼海無際</li> <li>碼海無際</li></ul>
注意:
1. <ul></ul>中只能嵌套<li></li>,直接在<ul></ul>標簽中輸入其他標簽或者文字的做法是不被允許的。 2. <li>與</li>之間相當于一個容器,可以容納所有元素。 3. 無序列表會帶有自己樣式屬性,但是不推薦使用,一般會用CSS設置。
有序列表即為有排列順序的列表,其各個列表項按照一定的順序排列定義
1.格式:
<ol type="符號類型"> <li type="符號類型"></li> <li type="符號類型"></li></ol>
2.有序列表的type屬性值:
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>
對列表條目進行簡短的說明
<dl> <dt>軟件說明:</dt> <dd>這是軟件說明</dd> <dt>軟件界面:</dt> <dd>這是軟軟件界面</dd></dl>
居中對齊
<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>
常用的表章節的標簽有哪些,分別是什么意思?
全局屬性有哪些?
常用的內容標簽有哪些,分別是什么意思?
HTML文件中,有些標簽會被經常用到,可能有人覺得太基礎,就不認真對待,但是我可以負責任的告訴你,越基礎的往往越重要。這次重點學一學標題、段落和鏈接等基礎標簽。
為了不重復粘貼HTML代碼,咱們來個約定,除了第一次出現完整的HTML文件的頁面結構之外,之后只現新增的標簽內容,你自己將新的內容,添加到HTML文件中,進行效果驗證。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>第3個HTML文件</title>
</head>
<body>
<!--這是一個完整的HTML頁面結構,常用標簽放在這個注釋后面即可-->
</body>
</html>
在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>
輸出結果
<p> 標簽定義段落。瀏覽器解析到<p>標簽時,會自動在其前后創建一些空白。<p>標簽的屬性也是align。其實為了HTML文件統一布局,很少會用align來指定位置,大多數是用CSS統一指定。
<p>老陳說編程,除了說編程,</p>
<p>還有程序員的愛情與友情,</p>
<p>那是不可能的。</p>
輸出結果
在網頁發的文字多時,好多人習慣性會使用分割線。在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"/>
輸出結果
無序列表<ul>標簽,可用粗體圓點標記一個項目的列表;有序列表<ol>標簽使用數字進行標記,而列表項用<li>標簽實現。有關列表的屬性,不是被H5拋棄,就是不被推薦,所以......。
<p>
程序員最喜歡做的三件事
<ul>
<li>編程</li>
<li>開發</li>
<li>敲代碼</li>
</ul>
程序員最喜歡的三個美女
<ol>
<li>潘金蓮</li>
<li>楊貴妃</li>
<li>楊八妹</li>
</ol>
</p>
輸出結果
<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#
*請認真填寫需求信息,我們會在24小時內與您取得聯系。