1、網(wǎng)頁有那些部分組成:
文字、圖像、鏈接等元素組成,還包括音頻,視頻flash等組成。
2、常見的瀏覽器:ie、火狐、Chrome、edge,Opera瀏覽器、Safari、
3、web標(biāo)準(zhǔn)三層組成:結(jié)構(gòu)(網(wǎng)頁元素進(jìn)行整理和分類,主要是html),表現(xiàn)(設(shè)置網(wǎng)頁元素的版式顏色大小外觀樣式,主要是指css),行為(網(wǎng)頁模型定義及交互的編寫,主要是學(xué)javascript)
4、html的認(rèn)識:
html是超文本語言,用來描述網(wǎng)頁的一種語言
html不是編程語言,而是一種標(biāo)記語言
標(biāo)記語言是一套標(biāo)記標(biāo)簽
標(biāo)簽有自己的語法規(guī)范,要放在<>
黑馬程序員視頻庫有免費(fèi)的課程,還有課件和源碼什么的。你可以去找一下。 非常適合入門。
html 代碼大全 1.結(jié)構(gòu)性定義 文件類型 (放在檔案的開頭與結(jié)尾) 文件主題
(顯示原始碼之用) 樣本 鍵盤輸入 變數(shù) 定義 (有些瀏覽器不提供) 地址 大字 小字 與外觀相關(guān)的標(biāo)簽(作者自訂的表現(xiàn)方式) 加粗 斜體 底線 (尚有些瀏覽器不提供) 刪除線在WWW上的一個(gè)超媒體文檔稱之為一個(gè)頁面(page)。
作為一個(gè)組織或個(gè)人在萬維網(wǎng)上放置開始點(diǎn)的頁面稱為主頁Homepage,或首頁,主頁中通常包括有指向其他相關(guān)頁面或其他節(jié)點(diǎn)的指針(超級鏈接)。在邏輯上將視為一個(gè)整體的一系列頁面的有機(jī)集合稱為網(wǎng)站(Website或Site)。
HTML是一種規(guī)范,一種標(biāo)準(zhǔn),它通過標(biāo)記符號來標(biāo)記要顯示的網(wǎng)頁中的各個(gè)部分。網(wǎng)頁文件本身是一種文本文件,通過在文本文件中添加標(biāo)記符,可以告訴瀏覽器如何顯示其中的內(nèi)容(如:文字如何處理,畫面如何安排,圖片如何顯示等)。
瀏覽器按順序閱讀網(wǎng)頁文件,然后根據(jù)標(biāo)記符解釋和顯示其標(biāo)記的內(nèi)容,對書寫出錯(cuò)的標(biāo)記將不指出其錯(cuò)誤,且不停止其解釋執(zhí)行過程,編制者只能通過顯示效果來分析出錯(cuò)原因和出錯(cuò)部位。但需要注意的是,對于不同的瀏覽器,對同一標(biāo)記符可能會有不完全相同的解釋 超文本標(biāo)記語言(15張),因而可能會有不同的顯示效果。
HTML之所以稱為超文本標(biāo)記語言,是因?yàn)槲谋局邪怂^“超級鏈接”點(diǎn)。所謂超級鏈接,就是一種URL指針,通過激活(點(diǎn)擊)它,可使瀏覽器方便地獲取新的網(wǎng)頁。
這也是HTML獲得廣泛應(yīng)用的最重要的原因之一。 網(wǎng)頁的本質(zhì)就是HTML,通過結(jié)合使用其他的Web技術(shù)(如:腳本語言、CGI、組件等),可以創(chuàng)造出功能強(qiáng)大的網(wǎng)頁。
因而,HTML是Web編程的基礎(chǔ),也就是說萬維網(wǎng)是建立在超文本基礎(chǔ)之上的。 編輯本段語言特點(diǎn) HTML文檔制作不是很復(fù)雜,且功能強(qiáng)大,支持不同數(shù)據(jù)格式的文件鑲?cè)?,這也是WWW盛行的原因之一,其主要特點(diǎn)如下: 1 簡易性,HTML版本升級采用超集方式,從而更加靈活方便。
2 可擴(kuò)展性,HTML語言的廣泛應(yīng)用帶來了加強(qiáng)功能,增加標(biāo)識符等要求,HTML采取子類元素的方式,為系統(tǒng)擴(kuò)展帶來保證。 3 平臺無關(guān)性。
雖然PC機(jī)大行其道,但使用MAC等其他機(jī)器的大有人在,HTML可以使用在廣泛的平臺上,這也是WWW盛行的另一個(gè)原因。 編輯HTML HTML其實(shí)是文本,它需要瀏覽器的解釋,HTML的編輯器大體可以分為三種, 1 基本編輯軟件,使用WINDOWS自帶的記事本或?qū)懽职娑伎梢跃帉?,?dāng)然,如果你用WPS來編寫,也可以。
不過存盤時(shí)請使用.htm或.html作為擴(kuò)展名,這樣瀏覽器就可以解釋執(zhí)行了。 2 半所見即所得軟件,這種軟件能大大提高開發(fā)效率,它可以使你在很短的時(shí)間內(nèi)做出HOMEPAGE,且可以學(xué)習(xí)HTML,這種類型的軟件主要有HOTDOG,還有國產(chǎn)的軟件網(wǎng)頁作坊。
3 所見即所得軟件,使用最廣泛的編輯器,完全可以一點(diǎn)不懂HTML的知識就可以做出網(wǎng)頁,這類軟件主要有FRONTPAGE2003,DREAMWEAVER。 編輯本段發(fā)展歷史HTML 超文本標(biāo)記語言(第一版)——在1993年6月作為互聯(lián)網(wǎng)工程工作小組(IETF)工作草案發(fā)布(并非標(biāo)準(zhǔn)): HTML 2.0——1995年11月作為RFC 1866發(fā)布,在RFC 2854于2000年6月發(fā)布之后被宣布已經(jīng)過時(shí) HTML 3.2——1996年1月14日,W3C推薦標(biāo)準(zhǔn) HTML 4.0——1997年12月18日,W3C推薦標(biāo)準(zhǔn) HTML 4.01(微小改進(jìn))——1999年12月24日,W3C推薦標(biāo)準(zhǔn) HTML 5 的第一份正式草案已于2008年1月22日公布,仍繼續(xù)完善 ISO/IEC 15445:2000(“ISO HTML”)——2000年5月15日發(fā)布,基于嚴(yán)格的HTML 4.01語法,是國際標(biāo)準(zhǔn)化組織和國際電工委員會的標(biāo)準(zhǔn)。
HTML沒有1.0版本是因?yàn)楫?dāng)時(shí)有很多不同的版本。有些人認(rèn)為蒂姆·伯納斯-李的版本應(yīng)該算初版,這個(gè)版本沒有IMG元素。
當(dāng)時(shí)被稱為HTML+的后續(xù)版的開發(fā)工作于1993年開始,最初是被設(shè)計(jì)成為“HTML的一個(gè)超集”。第一個(gè)正式規(guī)范為了和當(dāng)時(shí)的各種HTML標(biāo)準(zhǔn)區(qū)分開來,使用了2.0作為其版本號。
HTML+的發(fā)展繼續(xù)下去,但是它從未成為標(biāo)準(zhǔn)。 HTML3.0規(guī)范是由當(dāng)時(shí)剛成立的W3C于1995年3月提出,提供了很多新的特性,例如表格、文字繞排和復(fù)雜數(shù)學(xué)元素的顯示。
雖然它是被設(shè)計(jì)用來兼容2.0版本的,但是實(shí)現(xiàn)這個(gè)標(biāo)準(zhǔn)的工作在當(dāng)時(shí)過于復(fù)雜,在草案于1995年9月過期時(shí),標(biāo)準(zhǔn)開發(fā)也因?yàn)槿狈g覽器支持而中止了。3.1版從未被正式提出,而下一個(gè)被提出的版本是開發(fā)代號為Wilbur的HTML 3.2,去掉了大部分3.0中的新特性,但是加入了很多特定瀏覽器,例如Netscape和Mosaic的元素和屬性。
HTML對數(shù)學(xué)公式的支持最后成為另外一個(gè)標(biāo)準(zhǔn)MathML。 HTML 4.0同樣也加入了很多特定瀏覽器的元素和屬性,但是同時(shí)也開始“清理”這個(gè)標(biāo)準(zhǔn),把一些元素和屬性標(biāo)記為過時(shí)的,建議不再使用它們。
HTML的未來和CSS結(jié)合會更好。 HTML 5草案的前身名為Web Applications 1.0。
于2004年被WHATWG提出,于2007年被W3C接納,并成立了新的HTML工作團(tuán)隊(duì)。在2008年1月22日,第一份正式草案發(fā)布。
WHATWG表示該規(guī)范是目前正在進(jìn)行的工作,仍須多年的努力。 XHTML XHTML 1.0——發(fā)布于2000年1月26日,是W3C推薦標(biāo)準(zhǔn),后來經(jīng)過修訂于2002年8月1日重新發(fā)布。
XHTML 1.1,于2001年5月31日發(fā)布,W3C推薦標(biāo)準(zhǔn)。 XHTML 2.0,W3C工作草案。
XHTML 5,從XHTML 1.x的更新版,基于HTML 5草案。 編輯本段整體結(jié)構(gòu) 一個(gè)網(wǎng)頁對。
Html5開發(fā)可謂是這幾年來特別“受寵”的軟件開發(fā)了,html5不僅入行門檻低、薪資高,發(fā)展前景更是可觀,所以得到大家的追捧和青睞也是實(shí)至名歸的,那么想要從事html5開發(fā)學(xué)習(xí)要掌握哪些必備的知識呢?
那么想要學(xué)好html5開發(fā),那么需要掌握的專業(yè)技術(shù)有:
第1階段:前端頁面重構(gòu):PC端網(wǎng)站布局、HTML5+CSS3基礎(chǔ)項(xiàng)目、WebAPP頁面布局;
第2階段:JavaScript高級程序設(shè)計(jì):原生JavaScript交互功能開發(fā)、面向?qū)ο箝_發(fā)與ES5/ES6、JavaScript工具庫自主研發(fā);
第3階段:PC端全棧項(xiàng)目開發(fā):jQuery經(jīng)典特效交互開發(fā)、HTTP協(xié)議,Ajxa進(jìn)階與后端開發(fā)、前端工程化與模塊化應(yīng)用、PC端網(wǎng)站開發(fā)、PC端管理信息系統(tǒng)前端開發(fā);
第4階段:移動端webAPP開發(fā):Touch端項(xiàng)目、微信場景項(xiàng)目、應(yīng)用Vue.js開發(fā)WebApp項(xiàng)目、應(yīng)用Ionic開發(fā)WebApp項(xiàng)目、應(yīng)用React.js開發(fā)WebApp;
第5階段:混合(Hybrid)開發(fā):各類混合應(yīng)用開發(fā);
第6階段:NodeJS全棧開發(fā):WebApp后端系統(tǒng)開發(fā);
第7階段:大數(shù)據(jù)可視化:數(shù)據(jù)可視化入門、D3.jS詳解及項(xiàng)目實(shí)戰(zhàn)。
如今移動互聯(lián)網(wǎng)發(fā)展迅速,技術(shù)不斷的更新迭代,所學(xué)知識也需與時(shí)俱進(jìn)?,F(xiàn)在市場上的主流互聯(lián)網(wǎng)網(wǎng)站,需要打造的是一流用戶交互體驗(yàn)。對于前端開發(fā)者的要求,不再是簡單的頁面展示,而是需要全棧式的前端開發(fā)工程師。
程序猿學(xué)習(xí)就是要多寫,不斷的寫,不斷的熟悉,能看到不同的效果。。但不一定要死記硬背,熟悉就好。下面是一點(diǎn)資料。希望能幫上你。
HTML基本概念
1、標(biāo)記
HTML用于描述功能的符號稱為“標(biāo)記”。如“HTML”、“BODY”、“TABLE”等。標(biāo)記在使
用是必須用方括號“<>;”括起來,而且是成對出現(xiàn),無斜杠的標(biāo)記表示該標(biāo)記的作用開始,有斜杠的標(biāo)記表示該標(biāo)記的作用結(jié)束。
如<TABLE>;表示一個(gè)表格的開始,</TABLE>;表標(biāo)一個(gè)表格的結(jié)束。在HTML中,標(biāo)記的大小寫作用相同,
如<TABLE>;和<TABLE>;都是表示一個(gè)表格的開始。
標(biāo)記可以包含標(biāo)記,如:表格中包含表格或其它標(biāo)記,如下面這樣的HTML代碼結(jié)構(gòu)是正確的:
<TABLE WIDTH="50%" BORDER="10" CELLSPACING="10" CELLPADDING="10">
<TR>
<TD>
<TABLE WIDTH="100%" BORDER="1" CELLSPACING="1" CELLPADDING="1">
<TR>
<TD> </TD>
<TD> </TD>
<TD> </TD>
</TR>
</TABLE>
</TD>
<TD>
<P> </P>
<P>HJK</P>
<P> </P>
</TD>
<TD> </TD>
</TR>
</TABLE>
但是標(biāo)記不能交叉嵌套,如下面這樣的代碼是錯(cuò)誤的:
<DIV><SPAN>;這是不正確的代碼</DIV></SPAN>
2、特殊字符
由于方括號和英文雙引號被用來提示HTML的標(biāo)記及參數(shù)值,那么在網(wǎng)頁中要顯示方括號和英文引號只能用其它的符號來代替,下面是常見特殊字符所代表的正常字符:
<;或<;對應(yīng)字符 <
>;或>;對應(yīng)字符 >
"或"——對應(yīng)字符 "
à——對應(yīng)字符 A
3、語法
一個(gè)標(biāo)記,為了明確它的功能,往往用一些屬性參數(shù)來描述,對這些屬性參數(shù)的規(guī)定上就是所謂的語法,例如:段落標(biāo)記<P>;,它的語法格式是:
<P
ALIGN=LEFT|CENTER|RIGHT
CLASS=TYPE>
這就說明<P>;標(biāo)記有兩個(gè)屬性參數(shù),即“ALIGN”和“CLASS”,其中“ALIGN”用于定義段的位置是靠左、靠右還是居中。默認(rèn)值
是靠左。而“CLASS ”則是定義所屬的類型。在實(shí)際應(yīng)用時(shí)當(dāng)然可以沒有“ALIGN”和“CLASS”參數(shù),按照默認(rèn)情況顯示,這一點(diǎn)非常重要,這是
們判斷無用代碼的主要標(biāo)準(zhǔn)之一,假如在網(wǎng)頁代碼中有對默認(rèn)值進(jìn)行描述設(shè)置的語句代碼,顯然是無用的代碼。另外,在設(shè)置標(biāo)記的屬性值時(shí),若是取默認(rèn)值不影響
效果或影響很少, 們就盡量取默認(rèn)值,這樣可以不用設(shè)置,從而達(dá)到減少代碼的目的。
標(biāo)記參數(shù)的具體的值都有要加西文引號,如:要使段落內(nèi)容居中,正確的寫法是這樣的:<P ALIGN="CENTER">;段落內(nèi)容居中示例</P>
學(xué)好用好HTML語言的關(guān)鍵是靈活應(yīng)用標(biāo)記的參數(shù)。特別是默認(rèn)值的應(yīng)用。
這些都是HTML中的常用標(biāo)簽 他們都有特定的定義 沒有英文全名HTML標(biāo)簽詳解結(jié)構(gòu) 標(biāo)題 。
.文件內(nèi)容。
. 1.文件標(biāo)題 。
. 2.文件更新-- 【1】10秒后自動更新一次 【2】10秒后自動連結(jié)到另一文件 3.查詢用表單-- 若欲設(shè)定查詢欄位前的提示文字: 4.預(yù)設(shè)的基準(zhǔn)路徑-- 版面 1.標(biāo)題文字 。
. #=1~6;h1為最大字,h6為最小字 2.字體變化 。
. 【1】字體大小 。
. #=1~7;數(shù)字愈大字也愈大 【2】指定字型 。
. 【3】文字顏色 。
. rr:表紅色(red)色碼 gg:表綠色(green)色碼 bb:表藍(lán)色(blue)色碼 3.顯示小字體 。
. 4.顯示大字體 。
. 5.粗體字 。
. 6.斜體字 。
. 7.打字機(jī)字體 。
. 8.底線 。
. 9.刪除線 。
. 10.下標(biāo)字 。
. 11.上標(biāo)字 12.文字閃爍效果 。
. 13.換行 14.分段 15.文字的對齊方向 #號可為 left:表向左對齊(預(yù)設(shè)值) center:表向中對齊 right:表向右對齊 P.S.之后的文字都會以所設(shè)的對齊方式顯示, 直到出現(xiàn)另一個(gè)改變其對齊方向,或遇到 ?標(biāo)簽時(shí)會自動設(shè)回預(yù)設(shè)的向左對齊。 16.分隔線 【1】分隔線的粗細(xì) 【2】分隔線的寬度 【3】分隔線對齊方向 #號可為 left:表向左對齊(預(yù)設(shè)值) center:表向中對齊 right:表向右對齊 【4】分隔線的顏色 【5】實(shí)心分隔線 17.向中對齊 。
. 18.依原始樣式顯示 。
. 19.指令的屬性 【1】背景顏色 -- bgcolor 【2】背景圖案 -- background 【3】設(shè)定背景圖案不會卷動 -- bgproperties 【4】文件內(nèi)容文字的顏色 -- text 【5】超連結(jié)文字顏色 -- link 【6】正被選取的超連結(jié)文字顏色 -- vlink 【7】已連結(jié)過的超連結(jié)文字顏色 -- alink 20.注解 21.特殊字元表示法 符 號 語 法 > > & & " " 空白   圖片 1.插入圖片 2.設(shè)定圖框 -- border 3.設(shè)定圖形大小 -- width?height 4.設(shè)定圖形上下左右留空 -- vspace?hspace 5.圖形附注 6.預(yù)載圖片 P.S.兩個(gè)圖的圖形大小最好一致 7.影像地圖(Image Map) 【1】定義形狀 -- shape shape=rect:矩形 shape=circle:圓形 shape=poly:多邊形 【2】定義區(qū)域 -- coords a.矩形:必須使用四個(gè)數(shù)字,前兩個(gè)數(shù)字為左上角座標(biāo),后兩個(gè)數(shù)字為右下角座標(biāo) 例: b.圓形:必須使用三個(gè)數(shù)字,前兩個(gè)數(shù)字為圓心的座標(biāo),最后一個(gè)數(shù)字為半徑長度 例: c.任意圖形(多邊形):將圖形之每一轉(zhuǎn)折點(diǎn)座標(biāo)依序填入 例: 表格 1.定義表格 。
. 【1】設(shè)定邊框的厚度 -- border 【2】設(shè)定格線的寬度 -- cellspacing 【3】設(shè)定資料與格線的距離 -- cellpadding 【4】調(diào)整表格寬度 -- width 【5】調(diào)整表格高度 -- height 【6】設(shè)定表格背景色彩 -- bgcolor 【7】設(shè)定表格邊框色彩 -- bordercolor 2.顯示格線 3.表格標(biāo)題 。
. 表格標(biāo)題位置 -- align #號可為 top:表標(biāo)題置于表格上方(預(yù)設(shè)值) bottom:表標(biāo)題置于表格下方 4.定義列 5.定義欄位 《1》:靠左對齊 《2》:靠中對齊?粗體 【1】水平位置 -- align #號可為 left:向左對齊 center:向中對齊 right:向右對齊 【2】垂直位置 -- align #號可為 top:向上對齊 middle:向中對齊 bottom:向下對齊 【3】欄位寬度 -- width 【4】欄位垂直合并 -- rowspan 【5】欄位橫向合并 -- colspan 清單 一、目錄式清單 項(xiàng)目1 項(xiàng)目2 項(xiàng)目3 P.S.目錄式清單每一個(gè)項(xiàng)目不能超過20個(gè)字元(即10個(gè)中文字) 二、選項(xiàng)式清單 項(xiàng)目1 項(xiàng)目2 項(xiàng)目3 三、有序號的清單 項(xiàng)目1 項(xiàng)目2 項(xiàng)目3 【1】序號形式 -- type 或 #號可為 A:表以大寫英文字母A?B?C?D。
做為項(xiàng)目編號 a:表以小寫英文字母a?b?c?d。做為項(xiàng)目編號 I:表以大寫羅馬數(shù)字做為項(xiàng)目編號 i:表以小寫羅馬數(shù)字做為項(xiàng)目編號 1:表以阿拉伯?dāng)?shù)字做為項(xiàng)目編號(預(yù)設(shè)值) 【2】起始數(shù)字 -- start 【3】指定編號 -- value 四、無序號的清單 項(xiàng)目1 項(xiàng)目2 項(xiàng)目3 【1】項(xiàng)目符號形式 -- type 或 #號可為 disc:實(shí)心圓點(diǎn)(預(yù)設(shè)值) circle:空心圓點(diǎn) square:實(shí)心方塊 【2】原始清單 -- plain 【3】清單排列方式 -- warp 《1》清單垂直排列 《2》清單水平排列 五、定義式清單 項(xiàng)目1 項(xiàng)目1說明 項(xiàng)目2 項(xiàng)目2說明 項(xiàng)目3 項(xiàng)目3說明 緊密排列 -- compact P.S.如此可使的內(nèi)容與的內(nèi)容在同一行,僅 以數(shù)格空白相隔而不換行,但若的文字超過一 定的長度后,compact的作用就消失了! 表單 一、基本架構(gòu) 。
. 。
. 。
. 二、輸入文件型表單 。
. 。
. 【1】欄位類型 -- type #號可為 text:文字輸入 password:密碼 checkbox:多選鈕 radio:單選鈕 submit:接受按鈕 reset:重設(shè)按鈕 image:圖形鈕 hidden:隱藏欄位 【2】欄位名稱 -- name P.S.若type為submit?reset則name不必設(shè)定 【3】文件上的預(yù)設(shè)值 -- value 【4】設(shè)定欄位的寬度 -- size 【5】限制最大輸入字串的長度 -- maxlength 【6】預(yù)設(shè)checkbox或radio的初值 -- checked 【7】指定圖形的URL -- src 【8】圖文對齊 -- align #號可為 top:文字對齊圖片之頂端 middle:文字對齊圖片之中間 buttom:文字對齊圖片之底部 三、選擇式表單 。
. 。
. A、的屬性 【1】欄位名稱 -- name 【2】設(shè)定顯示的選項(xiàng)數(shù) -- size 【3】多重選項(xiàng) -- multiple B、的屬性 【1】定義選項(xiàng)的傳回值 -- value 【2】預(yù)先選取的選項(xiàng) -- selected 四、多列輸入文字區(qū)表單 。
. 。
. 。
基礎(chǔ)是的先學(xué)好HTML。CSS ,Javascript ,jQuery。
其中HTML5主要是要HTML控件+Javascript的腳本程序。
建議先去學(xué)好Html CSS和JavaScript(通常是一起的),然后再看HTML5。這類書籍還是很多的,而且大都大同小異。
重要的是Html5 有2D 繪圖的 Canvas 對象 非常炫
還有瀏覽器建議使用firefox,裝個(gè)firebug控件,會對你調(diào)試代碼時(shí)有很大幫助!
這種樣式表就不單獨(dú)寫了直接放進(jìn)去了!
<html>
<head><title>;點(diǎn)歌超鏈接<title>
<style type="text/css">
a {
text-decoration:none; /*去除超鏈接的下劃線,要是想保留就把這行代碼刪除!*/
color:red; /*設(shè)置超鏈接原本的字體為紅色,也就是沒有訪問過的超鏈接字體顏色*/
}
a:active {
color:blue; /*被訪問過的超鏈接中字體的顏色為藍(lán)色*/
}
a:hover {
color:yello; /*鼠標(biāo)經(jīng)過時(shí)候字體顏色變?yōu)辄S色,不需要可以刪除這行代碼*/
}
</style>
</head>
<body>
<a href="在這里添加點(diǎn)歌表網(wǎng)頁連接地址" target="_blank">;點(diǎn)歌</a>
</body>
</html>
聲明:本網(wǎng)站尊重并保護(hù)知識產(chǎn)權(quán),根據(jù)《信息網(wǎng)絡(luò)傳播權(quán)保護(hù)條例》,如果我們轉(zhuǎn)載的作品侵犯了您的權(quán)利,請?jiān)谝粋€(gè)月內(nèi)通知我們,我們會及時(shí)刪除。
蜀ICP備2020033479號-4 Copyright ? 2016 學(xué)習(xí)鳥. 頁面生成時(shí)間:3.170秒