全棧攻城獅-每日更新原創(chuàng)IT編程技術(shù)及日常實用視頻。
主要內(nèi)容:這是HTML課程的第四課,主要講解HTML的文字標(biāo)簽和格式標(biāo)簽。在今天我們做一個屬于自己的簡歷。
在上一節(jié)中主要講解了HTML的標(biāo)題標(biāo)簽(h1~h7)以及加粗、斜體、下劃線、上下標(biāo)等格式的標(biāo)簽。上節(jié)請戳→HTML電腦編程03 標(biāo)題物理字體標(biāo)簽的使用,大學(xué)生學(xué)編程
HTML
font標(biāo)簽通過字面意思來看,就是字體的意思。是的這是一個用來顯示文字的標(biāo)簽。不過值得說的是,這個文字可以通過屬性的方式,指定顏色和字體大小。比如:
font標(biāo)簽的寫法
效果:
font標(biāo)簽的顯示效果
從書寫的HTML代碼可以看出,font標(biāo)簽包括兩個參數(shù):
color(字體的顏色):顏色的值可以為英文,也可以為RGB數(shù)值。
size(字體的大小):通過數(shù)字1~7可以控制字體的大小。
face(文字的顯示字體):這個屬性可以設(shè)置顯示的字體。如可以寫為:face="楷體"
在HTML中包括兩種顏色體系。一種就是直接寫顏色的英文,如:red(紅色)、blue(藍色)、green(綠色)等。
不同顏色
另外一種顏色體系是RGB。由R(Red)、G(Green)、B(Blue)三種顏色組成。相信小時候很多人都知道兩種不同的顏料,可以轉(zhuǎn)換為不同的顏色。RGB就是通過紅綠藍不同的明暗程度。來表示所有的顏色的。
RGB
RGB中的每一個顏色都是以六位十六進制進行表示。數(shù)值越大顏色越深。如:000000表示黑色。FFFFFF表示白色。RGB的表示形式一般前面增加#號。
段落標(biāo)簽為p。會為里面的文字自動分段顯示:
p標(biāo)簽自動分段
換行標(biāo)簽為br,這是個單標(biāo)簽。寫法為:<br/>。
br標(biāo)簽的形式
效果:
換行標(biāo)簽的效果
默認情況下,HTML的文檔排列形式為自上而下,自左而右。標(biāo)簽包括行級標(biāo)簽和塊級標(biāo)簽。如果想要對塊級標(biāo)簽進行換行,你就需要使用br標(biāo)簽。
下面是幾個標(biāo)簽,大家直接Sublime中寫入看一下效果哦。在以后就直接使用啦
居中預(yù)格式化標(biāo)簽
言:在完成了使用開源的Atom軟件搭建好編寫markdown的環(huán)境后,接下來就進行我們的第一個markdown文件的編寫,同時學(xué)習(xí)markdown標(biāo)記語言的基礎(chǔ)語法,都是十分簡單的一些標(biāo)記,如果學(xué)習(xí)過HTML標(biāo)記語言或者了解過HTML標(biāo)記語言的就十分清楚,markdown也是一種標(biāo)記語言,與HTML有著類似的效果功能,同時在markdown中還支持HTML標(biāo)簽語法。廢話不多說,直接上干貨!
0、目錄
在需要目錄出現(xiàn)的地方放置一個標(biāo)記,自動生成嵌套包含所有標(biāo)題的列表,標(biāo)記:[TOC]。
1、標(biāo)題
用#的個數(shù)表示幾級標(biāo)題,#與標(biāo)題之間至少一個空格,有1到6級標(biāo)題;
在標(biāo)題下面使用任意個===符號表示一級標(biāo)題,使用任意個---符號表示二級標(biāo)題。
2、列表
無序列表,使用-、+、*表示,至少一個空格;
有序列表,使用數(shù)字加英文.表示,至少一個空格。
小提示:在使用列表時,只要是數(shù)字后面加上英文的點,就會無意間產(chǎn)生列表,比如2017.12.30 這時候想表達的是日期,有些軟件把它被誤認為是列表。解決方式:在每個點前面加上\就可以了。
3、引用
引用以>來表示,引用中支持多級引用、標(biāo)題、列表、代碼塊、分割線等常規(guī)語法。
4、文字樣式
2個*代表加粗,1個*代表斜體,~~代表刪除,都是一對標(biāo)簽,前后都要有;
3個*或者-表示加粗斜體,刪除是指由中間劃線;
字體上標(biāo)(superscript)和下標(biāo)(subscript )<sup><sup>、<sub><sub>。
5、圖片與鏈接(Images & Links)
圖片與鏈接的語法很像,區(qū)別在一個 ! 號。
小提示:Markdown 不能設(shè)置圖片大小,如果必須設(shè)置則應(yīng)使用HTML標(biāo)記 <img>;
圖片:![]() ;
鏈接:[]() [鏈接描述](鏈接的地址)。
6、代碼引用,預(yù)覽支持語法高亮顯示,形式如下
``` C
C語言源代碼
```
行內(nèi)式:如果在一個行內(nèi)需要引用代碼,只要用反引號`引起來就好(一般在ESC鍵下方,和~同一個鍵)。
7.表格(Tables)
表格對齊格式,居左::----;居中::----:或-----;居右:----:。
8、分割線
使用***符號獨自在一行,不能有其他字符,處理空格之外;
___三個下劃線在一行;
用三個以上的星號(*)、減號(-)、底線(_)來建立一個分隔線。
小提示:Markdown 可以利用反斜杠\來插入一些在語法中有其它意義的符號,轉(zhuǎn)義字符。
9、自動連接
Markdown 支持以比較簡短的自動鏈接形式來處理網(wǎng)址和電子郵件信箱,只要是用<>包起來, Markdown 就會自動把它轉(zhuǎn)成鏈接。也可以直接寫,也是可以顯示成鏈接形式的,直接寫URL鏈接。
10、 換行
方法1: 連續(xù)兩個以上空格+回車 ;
方法2:使用html語言換行標(biāo)簽:<br>。
11、錨點
錨點其實就是頁內(nèi)超鏈接。比如我這里寫下一個錨點,點擊回到目錄,就能跳轉(zhuǎn)到目錄。 在目錄中點擊這一節(jié),就能跳過來。語法說明: 在你準備跳轉(zhuǎn)到的指定標(biāo)題后插入錨點{#標(biāo)記},然后在文檔的其它地方寫上連接到錨點的鏈接。
12、注腳
語法說明: 在需要添加注腳的文字后加上腳注名字[^注腳名字],稱為加注。 然后在文本的任意位置(一般在最后)添加腳注,腳注前必須有對應(yīng)的腳注名字。腳注自動被搬運到最后面,請到文章末尾查看,并且腳注后方的鏈接可以直接跳轉(zhuǎn)回到加注的地方。
13、首行縮進兩個字符:(每個表示一個空格,連續(xù)使用兩個即可)
方法一: 半角的空格;
方法二: 全角的空格
14、使用LaTex數(shù)學(xué)公式
方法1.行內(nèi)公式:使用兩個”$”符號引用公式:
輸入latex公式:$E=mc^2$;
方法2.行間公式:使用兩對“$$”符號引用公式:
輸入latex公式:$\sqrt{x^{2}}$ 。
# 前端復(fù)習(xí) html(一)
HTML基礎(chǔ)
HTML: 制作網(wǎng)頁
純文本協(xié)議: 只保存內(nèi)容不保存樣式
**HTML概述:**
1 聲明必須是 HTML 文檔的第一行,位于 <html> 標(biāo)簽之前。
2<!DOCTYPE> 聲明不是 HTML 標(biāo)簽;它是指示 web 瀏覽器關(guān)于頁面使用哪個 HTML 版本進行編寫的指令。
3在 HTML 4.01 中,<!DOCTYPE> 聲明引用 DTD,因為 HTML 4.01 基于 SGML。DTD 規(guī)定了標(biāo)記語言的規(guī)則,這樣瀏覽器才能正確地呈現(xiàn)內(nèi)容。
4HTML5 不基于 SGML,所以不需要引用 DTD。
**常用的 DOCTYPE 聲明**
HTML5 : !DOCTYPE html
HTML 4.01 Strict : !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"
XHTML 1.0 Strict : !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
> 現(xiàn)在開發(fā)直接使用HTML5文檔聲明即可
**HTML標(biāo)簽**
1:聲明是一個html文檔,所有的標(biāo)簽都寫在它內(nèi)部
2:此元素可告知瀏覽器其自身是一個 HTML 文檔。
3:<html> 與 </html> 標(biāo)簽限定了文檔的開始點和結(jié)束點,在它們之間是文檔的頭部和主體。
Meta標(biāo)簽
meta標(biāo)簽概述
META標(biāo)簽是HTML標(biāo)記HEAD區(qū)的一個關(guān)鍵標(biāo)簽
它位于HTML文檔的<head>和<title>之間
它提供的信息雖然用戶不可見,但卻是文檔的最基本的元信息。
<meta>除了提供文檔字符集、使用語言、作者等基本信息外,還涉及對關(guān)鍵詞和網(wǎng)頁等級的設(shè)定
<meta charset="UTF-8">
字符
是各種文字和符號的總稱,包括各國家文字、標(biāo)點符號、圖形符號、數(shù)字等
字符集
字符集(Character set)是多個字符的集合,字符集種類較多,每個字符集包含的字符個數(shù)不同
常用字符集
ASCII字符集
是基于羅馬字母表的一套電腦編碼系統(tǒng)。
它主要用于顯示現(xiàn)代英語和其他西歐語言。
圖示
GB2312字符集
GB2312是中國國家標(biāo)準的簡體中文字符集。它所收錄的漢字已經(jīng)覆蓋99.75%的使用頻率,
基本滿足了漢字的計算機處理需要。在中國大陸和新加坡獲廣泛使用。
GB18030字符集
GB 18030的全稱是GB18030-2000《信息交換用漢字編碼字符集基本集的擴充》,
是我國政府于2000年3月17日發(fā)布的新的漢字編碼國家標(biāo)準,2001年8月31日后在中國市場上
發(fā)布的軟件必須符合本標(biāo)準。
Unicode
支持現(xiàn)今世界各種不同語言的書面文本的交換、處理及顯示。
UTF-8 編碼
UTF-8是Unicode的其中一個使用方式。
支持現(xiàn)今世界各種不同語言的書面文本的交換、處理及顯示。
開發(fā)中我們使用的都是UTF-8編碼
為什么要設(shè)置字符編碼
告訴瀏覽器到哪一個字符集庫當(dāng)中找對應(yīng)的字符進行顯示
比如現(xiàn)在網(wǎng)頁當(dāng)中寫的是中文.如果你指定的ASCII字符集
瀏覽器就會到ASCII字符集庫當(dāng)中找對應(yīng)的漢字進行顯示.
但是ASCII字符集庫中只有英語和其他西歐語言。
沒有漢字,就會在網(wǎng)頁當(dāng)中顯示亂碼!
開發(fā)中我們都是使用UTF-8的字符集庫,因為它里面幾乎包含了全世界所有國家的字符,
所以到它當(dāng)中肯定能找到對應(yīng)的內(nèi)容進行正確的顯示!
基礎(chǔ)標(biāo)簽
<title>定義文檔的標(biāo)題。
瀏覽器標(biāo)簽顯示的標(biāo)簽
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>網(wǎng)頁標(biāo)題</title>
</head>
<body>
網(wǎng)頁內(nèi)容
</body>
</html>
```
<h1> 到 <h6>定義標(biāo)題
<body>
<h1>我是h1</h1>
<h2>我是h2</h2>
<h3>我是h3</h3>
<h4>我是h4</h4>
<h5>我是h5</h5>
<h6>我是h6</h6>
<h7>我是h7</h7>
</body>
```
<p>定義段落。
<hr>定義水平線。
```html
<hr>我是水平線
```
<br>定義簡單的換行。
```html
<br>我是換行
```
<!--...-->定義注釋。
```html
<!-- 我是注釋 -->
```
基本樣式
可以的標(biāo)簽當(dāng)中添加一些基本的樣式
這些樣式可以修改字體的大小,顏色,讓文字更加豐富起來
*請認真填寫需求信息,我們會在24小時內(nèi)與您取得聯(lián)系。