整合營銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
TML 文本格式化
加粗文本
斜體文本
電腦自動輸出
這是 下標(biāo) 和 上標(biāo)
HTML 格式化標(biāo)簽
HTML 使用標(biāo)簽<b> 與<i> 對輸出的文本進(jìn)行格式, 如：粗體 or 斜體
這些HTML標(biāo)簽被稱為格式化標(biāo)簽（請查看底部完整標(biāo)簽參考手冊）。
| 通常標(biāo)簽 <strong> 替換加粗標(biāo)簽 <b> 來使用, <em> 替換 <i>標(biāo)簽使用。然而，這些標(biāo)簽的含義是不同的：<b> 與<i> 定義粗體或斜體文本。<strong> 或者 <em>意味著你要呈現(xiàn)的文本是重要的，所以要突出顯示。現(xiàn)今所有主要瀏覽器都能渲染各種效果的字體。不過，未來瀏覽器可能會支持更好的渲染效果。 |
在線實例
文本格式化
此例演示如何在一個 HTML 文件中對文本進(jìn)行格式化
預(yù)格式文本
此例演示如何使用 pre 標(biāo)簽對空行和空格進(jìn)行控制。
"計算機(jī)輸出"標(biāo)簽
此例演示不同的"計算機(jī)輸出"標(biāo)簽的顯示效果。
地址
此例演示如何在 HTML 文件中寫地址。
縮寫和首字母縮寫
此例演示如何實現(xiàn)縮寫或首字母縮寫。
文字方向
此例演示如何改變文字的方向。
塊引用
此例演示如何實現(xiàn)長短不一的引用語。
刪除字效果和插入字效果
此例演示如何標(biāo)記刪除文本和插入文本。
HTML 文本格式化標(biāo)簽
| 標(biāo)簽 | 描述 |
|---|---|
| <b> | 定義粗體文本 |
| <em> | 定義著重文字 |
| <i> | 定義斜體字 |
| <small> | 定義小號字 |
| <strong> | 定義加重語氣 |
| <sub> | 定義下標(biāo)字 |
| <sup> | 定義上標(biāo)字 |
| <ins> | 定義插入字 |
| <del> | 定義刪除字 |
HTML "計算機(jī)輸出" 標(biāo)簽
| 標(biāo)簽 | 描述 |
|---|---|
| <code> | 定義計算機(jī)代碼 |
| <kbd> | 定義鍵盤碼 |
| <samp> | 定義計算機(jī)代碼樣本 |
| <var> | 定義變量 |
| <pre> | 定義預(yù)格式文本 |
HTML 引文, 引用, 及標(biāo)簽定義
| 標(biāo)簽 | 描述 |
|---|---|
| <abbr> | 定義縮寫 |
| <address> | 定義地址 |
| <bdo> | 定義文字方向 |
| <blockquote> | 定義長的引用 |
| <q> | 定義短的引用語 |
| <cite> | 定義引用、引證 |
| <dfn> | 定義一個定義項目。 |
如您還有不明白的可以在下面與我留言或是與我探討QQ群308855039，我們一起飛！
HTML簡介
HTML是用來描述網(wǎng)頁的一種語言，它是一種超文本標(biāo)記語言，由一套標(biāo)記標(biāo)簽組成，在制作網(wǎng)頁時，HTML使用標(biāo)記標(biāo)簽來描述網(wǎng)頁。
發(fā)展史
HTML：Hyper Text Markup Language超文本標(biāo)記語言
超文本標(biāo)記語言—在1993年6月互聯(lián)網(wǎng)工程工作小組工作案發(fā)布（并非標(biāo)準(zhǔn)）
HTML2.0—1995年11月作為RFC1866發(fā)布，在RFC2854于2000年6月發(fā)布之后被宣布過時。
HTML3.2—1996年1月14日，W3C推薦標(biāo)準(zhǔn)
HTML4.0—1997年12月18日，W3C推薦標(biāo)準(zhǔn)
HTML4.01（微小改進(jìn)）—1999年12月24日，W3C推薦標(biāo)準(zhǔn)，2000年5月15日發(fā)布基本嚴(yán)格的HTML4.01語法，是國標(biāo)標(biāo)準(zhǔn)化組織和國際電工委員會的標(biāo)準(zhǔn)
XHTML1.0—發(fā)布于2000年1月26日，是W3C推薦標(biāo)準(zhǔn)，后來經(jīng)過修訂于2002年8月1日重新發(fā)布
XHTML1.1—2001年5月31日發(fā)布
XHTML2.0是W3C的工作草案，由于改動過大，學(xué)習(xí)這個新技術(shù)的成本過高而最終胎死腹中，因此，現(xiàn)在最常用的還是XHTML1.0標(biāo)準(zhǔn)。
目前最新的版本為HTML5，它是2004年被提出，2007年被W3C接納并成立新的HTML工作團(tuán)隊，
2008年1月22日公布HTML5第一份正式草案，
2012年12月17日HTML5規(guī)范正式定稿，
2013年5月6日，HTML5.1正式草案公布。
HTML 5作為最新版本，提供了一些新的元素和一些有趣的新特性，同時也建立了一些新的規(guī)則。這些元素、特性和規(guī)則的建立，提供了許多新的網(wǎng)頁功能，如使用網(wǎng)頁實現(xiàn)動態(tài)渲染圖形、圖表、圖像和動畫，以及不需要安裝任何插件直接使用網(wǎng)頁播放視頻等。目前企業(yè)開發(fā)中也在增大使用HTML5的力度
HTML的優(yōu)勢
h1~h6
源代碼
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>標(biāo)題標(biāo)簽</title> </head> <body> <h1>這是一級標(biāo)題</h1> <h2>這是二級標(biāo)題</h2> <h3>這是三級標(biāo)題</h3> <h4>這是四級標(biāo)題</h4> <h5>這是五級標(biāo)題</h5> <h6>這是六級標(biāo)題</h6> <h7>這是七級標(biāo)題</h7>效果怎么顯示不出來呢？？？ <h1>這是一級標(biāo)題</h1> </body> </html> |
瀏覽器預(yù)覽效果
p標(biāo)簽為段落標(biāo)簽，br標(biāo)簽為換行標(biāo)簽
源代碼
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>段落和換行標(biāo)簽</title> </head> <body> <h1>北京歡迎你</h1> <p>北京歡迎你，<br>為你開天辟地</p> <p>北京歡迎你，<br/>有有勇氣就會有奇跡</p> </body> </html> |
瀏覽器預(yù)覽效果圖
hr標(biāo)簽為水平線標(biāo)簽
源代碼
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>水平線標(biāo)簽</title> </head> <body> <h1>漂洋過海來看你</h1> <hr> <p>為你我用了半年的積蓄，<br>漂洋過海來看你</p> <hr/> </body> </html> |
瀏覽器預(yù)覽效果圖
em為斜體標(biāo)簽，strong為字體加粗標(biāo)簽
源代碼
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>字體樣式標(biāo)簽</title> </head> <body> <h1>漂洋過海來看你</h1> <hr> <p>為你我用了<em>2017</em>半年的<strong><em>積蓄</em></strong>，<br> <em><strong>漂洋過海</strong></em>來看你 </p> <hr/> </body> </html> |
瀏覽器預(yù)覽效果圖
注釋使用：<!--被注釋的內(nèi)容-->
大于號：> great than的縮寫
小于號：< less than的縮寫
雙引號：""
版權(quán)符號：©
空格：
源代碼
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>注釋和特殊符號</title> </head> <body> <pre> 注釋使用：<!--被注釋的內(nèi)容--> 大于號：> great than的縮寫 小于號：< less than的縮寫 雙引號："" 版權(quán)符號：© 空格： </pre> <!-- 我是被注釋的內(nèi)容，我只留給你們看，不會在頁面上顯示 --> 5<10>6 <br> "我是被雙引號引起來的內(nèi)容"<br> ©自由職業(yè)開發(fā)者公司<br> 我是 測試 空 格的 </body> </html> |
瀏覽器預(yù)覽效果圖
以上就是HTML的簡單入門，后續(xù)帶大家更深入的了解HTML
HTML 在頁面上放置了一個按鈕
<button class="btn">點(diǎn)擊按鈕</button>如果想要實現(xiàn)當(dāng)鼠標(biāo)懸停在按鈕上時，按鈕文字加粗，在 CSS 里這樣設(shè)置
.btn:hover {
font-weight: bolder;
}但是這樣做了之后，當(dāng)文字加粗后，勢必會將按鈕的尺寸撐的更大。那么有可能會影響到按鈕周圍其他 HTML 元素的位置，如果你的頁面內(nèi)容比較多，而且比較緊湊的話，撐大的按鈕會將周圍的元素推開，這很有可能會擾亂頁面的布局。
如果既要保留按鈕的鼠標(biāo)懸停文字加粗的效果，還不能影響到周圍元素的位置，可以再給按鈕設(shè)定一個固定的尺寸。
.btn {
padding: 1rem;
width: 4rem;
}
.btn:hover {
font-weight: bolder;
}這樣按鈕的尺寸就不會變化，但是文字在鼠標(biāo)懸停時會加粗，按鈕周圍的元素也不會受到影響。
以上這種情況一般在頁面頂部的導(dǎo)航條上最為常見，請大家注意。
*請認(rèn)真填寫需求信息，我們會在24小時內(nèi)與您取得聯(lián)系。
