成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

學習前端筆記1(HTML)

xeblog / 1478人閱讀

摘要:注此文是在看過許多學習資料和視頻之后,加上自身理解拼湊而成,僅作學習之用。宋體無文檔聲明瀏覽器以怪異模式解析宋體標簽宋體不使用宋體代碼來實現(xiàn)頁面表現(xiàn)宋體學習宋體重點在于語義性。

(注:此文是在看過許多學習資料和視頻之后,加上自身理解拼湊而成,僅作學習之用。若有版權問題,麻煩及時聯(lián)系)

標準頁面結構:

?

?

?


Html發(fā)展歷史:?

?

注:每一種HTML需要有對應的doctype聲明。?

H5 ?無文檔聲明瀏覽器以怪異模式解析html


??

?

Html標簽:

?

不使用html代碼來實現(xiàn)頁面表現(xiàn)!?。。。。?/span>

學習html重點在于語義性。

中的meta標簽選擇字符集:

?

1、標題標簽:

HTML中,一共有六級標題標簽h1 ~ h6

在顯示效果上h1最大,h6最小,但是文字的大小我們并不關心

使用HTML標簽時,關心的是標簽的語義,我們使用的標簽都是語義化標簽

6級標題中,h1的最重要,表示一個網(wǎng)頁中的主要內(nèi)容,h2 ~ h6重要性依次降低

對于搜索引擎來說,h1的重要性僅次于title,搜索引擎檢索完title,會立即查看h1中的內(nèi)容

h1標簽非常重要,它會影響到頁面在搜索引擎中的排名,頁面只能寫一個h1。

一般頁面中標題標簽只使用h1 h2 h3,h3以后的基本不使用

2、段落標簽,

段落標簽用于表示內(nèi)容中的一個自然段

使用

標簽來表示一個段落

p標簽中的文字,默認會獨占一行,并且段與段之間會有一個間距

3HTML中,字符之間寫再多的空格,瀏覽器也會當成一個空格解析,

換行也會當成一個空格解析。

在頁面中可以使用
標簽來表示一個換行,br標簽是一個自結束標簽


標簽也是一個自結束標簽,可以在頁面中生成一條水平線

4、轉義字符 ?在HTML中,一些如< >這種特殊字符是不能直接使用,需要使用一些特殊的符號來表示這些特殊字符,這些特殊符號我們稱為實體(轉義字符串)瀏覽器解析到實體時,會自動將實體轉換為其對應的字符

實體的語法:

&實體的名字;

< ?< ?lower it

1 < <
2 > >
3 © ?
4   [空格]

?

> ?> ?greater it

空格 ?? ?Non-Breaking Space

版權符號 ?

5、img

使用img標簽來向網(wǎng)頁中引入一個外部圖片,

img標簽也是一個自結束標簽

屬性:

src:設置一個外部圖片的路徑

alt可以用來設置在圖片不能顯示時,對圖片的描述

搜索引擎可以通過alt屬性來識別不同的圖片

如果不寫alt屬性,則搜索引擎不會對img中的圖片進行收錄

width:可以用來修改圖片的寬度,一般使用px作為單位

height :可以用來修改圖片的高度,一般使用px作為單位

寬度和高度兩個屬性如果指設置一個,另一個也會同時等比例調(diào)整大小。如果兩個值同時指定則按照你指定的值來設置

一般開發(fā)中除了自適應的頁面,不建議設置widthheight

src屬性配置的是圖片的路徑,目前我們所要使用的路徑全都是相對路徑。

相對路徑:

相對路徑指相對于當前資源所在目錄的位置

<img src="abc/bcd/2.gif" alt="描述"/>

?

?

可以使用../來返回一級目錄,返回幾級目錄就寫幾個../

圖片的格式

JPEG(JPG)

- JPEG圖片支持的顏色比較多,圖片可以壓縮,但是不支持透明

- 一般使用JPEG保存照片等顏色豐富的圖片 ??GIF

- GIF支持的顏色少,只支持簡單的透明,支持動態(tài)圖

- 圖片顏色單一或者是動態(tài)圖時可以使用gif

PNG

- PNG支持的顏色多,并且支持復雜的透明

- 可以用來顯示顏色復雜的透明的圖片

圖片的使用原則:

效果不一致,使用效果好的

效果一致,使用小的

6、使用meta標簽還可以用來設置網(wǎng)頁的關鍵字

<meta name="keywords" content="HTML5,JavaScript,前端,Java" />

?

還可以用來指定網(wǎng)頁的描述

搜索引擎在檢索頁面時,會同時檢索頁面中的關鍵詞和描述,但是這兩個值不會影響頁面在搜索引擎中的排名

<meta name="description" content="發(fā)布h5、js等前端相關的信息" />使用meta可以用來做請求的重定向

<meta http-equiv="refresh" content="秒數(shù);url=目標路徑" />

<meta http-equiv="refresh" content="5;url=http://www.baidu.com" />

?

71.HTML不區(qū)分大小寫,但是我們一般都使用小寫

2.HTML中的注釋不能嵌套

3.HTML標簽必須結構完整,要么成對出現(xiàn),要么自結束標簽

瀏覽器盡最大的努力正確的解析頁面,你所有的不符合語法規(guī)范的內(nèi)容,瀏覽器都會為你自動修正,但是有些情況會修正錯誤

4.HTML標簽可以嵌套,但是不能交叉嵌套

5.HTML標簽中的屬性必須有值,且值必須加引號(雙引號單引號都可以)

8、iframe

<iframe src="demo02.html" name="tom">iframe>

?

使用內(nèi)聯(lián)框架可以引入一個外部的頁面

使用iframe來創(chuàng)建一個內(nèi)聯(lián)框架

屬性:

src :指向一個外部頁面的路徑,可以使用相對路徑

width

height

name :可以為內(nèi)聯(lián)框架指定一個name屬性

在現(xiàn)實開發(fā)中不推薦使用內(nèi)聯(lián)框架,因為內(nèi)聯(lián)框架中的內(nèi)容不會被搜索引擎所檢索

9、超鏈接

使用超鏈接可以讓我們從一個頁面跳轉到另一個頁面

使用a標簽來創(chuàng)建一個超鏈接

屬性:

href:指向鏈接跳轉的目標地址,可以寫一個相對路徑也可以寫一個完整的地址

Targeta標簽中的target屬性可以用來指定打開鏈接的位置

可選值:

_self,表示在當前窗口中打開(默認值)

_blank,在新的窗口中打開鏈接

可以設置一個內(nèi)聯(lián)框架的name屬性值,鏈接將會在指定的內(nèi)聯(lián)框架中打開

標簽中的內(nèi)容,會默認在頁面中居中顯示 ,我們可以將要居中的元素,全都放到center

10、超鏈接中的#

創(chuàng)建超鏈接時,如果地址不確定可以直接寫一個#作為占位符

如果將鏈接地址設置為#,則點擊超鏈接以后,會自動跳轉到當前頁面的頂部,跳轉到idbottom的元素所在的位置,直接在href中寫 #id屬性值

11、id

html中有一個屬性,每一個元素都可以設置,該屬性可以作為標簽的唯一標識

這個屬性就是idid屬性在同一個頁面中只能有一個不能重復

12、郵箱超鏈接

發(fā)送電子郵件的超鏈接,點擊鏈接以后可以自動打開計算機中默認的郵件客戶端href="mailto:郵件地址"

當點擊這個超鏈接時,會默認打開計算機的默認電子郵件客戶端,并且將收件人設置mailto后的郵件地址

?

?

最后,因為ie8及更早之前的版本不支持H5,故

我們可以使用 Sjoerd Visscher 創(chuàng)建的 "HTML5 Enabling JavaScript", "?shiv" 來解決該問題:

國內(nèi)用戶請使用百度靜態(tài)資源庫(Google 資源庫在國內(nèi)不穩(wěn)定)

?

? ? ?

文章版權歸作者所有,未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉載請注明本文地址:http://systransis.cn/yun/1379.html

相關文章

  • 重學前端學習筆記(四)--div和span不是夠用嗎?

    摘要:筆記說明重學前端是程劭非前手機淘寶前端負責人在極客時間開的一個專欄,每天分鐘,重構你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的可以加入的專欄學習原文有的語音,如有侵權請聯(lián)系我,郵箱。 筆記說明 重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的可以...

    lx1036 評論0 收藏0
  • 重學前端學習筆記(四)--div和span不是夠用嗎?

    摘要:筆記說明重學前端是程劭非前手機淘寶前端負責人在極客時間開的一個專欄,每天分鐘,重構你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的可以加入的專欄學習原文有的語音,如有侵權請聯(lián)系我,郵箱。 筆記說明 重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的可以...

    ctriptech 評論0 收藏0
  • 重學前端學習筆記(四)--div和span不是夠用嗎?

    摘要:筆記說明重學前端是程劭非前手機淘寶前端負責人在極客時間開的一個專欄,每天分鐘,重構你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的可以加入的專欄學習原文有的語音,如有侵權請聯(lián)系我,郵箱。 筆記說明 重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的可以...

    KnewOne 評論0 收藏0
  • 學習筆記 | HTML 基本結構和基本標簽 ——前端學習第一步!

    摘要:基本結構語言中,一個頁面是由四個部分組成文檔聲明標簽對標簽對標簽對圖示文檔聲明這是一個文檔聲明,表示這是一個頁面。標簽標簽表示頁面內(nèi)容的范圍。 HTML HTML ...

    sPeng 評論0 收藏0
  • 重學前端學習筆記(五)--如何運用語義類標簽來呈現(xiàn)Wiki網(wǎng)頁?

    摘要:語義如何運用語義類標簽來呈現(xiàn)網(wǎng)頁通過網(wǎng)頁案例來學習語義類標簽最初的設計場景就是超文本,早期工作組的專家都是出版界書籍排版的專家。標記的部分有三個注記,它在文章中的作用就是額外的注釋,但是中并沒有相關的語義,這時可以使用標簽進行相關實現(xiàn)。 筆記說明 重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構你的前端知識體系,筆者主要整理學習過程的一...

    ckllj 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<