web前端知識介紹課件_第1頁
web前端知識介紹課件_第2頁
web前端知識介紹課件_第3頁
web前端知識介紹課件_第4頁
web前端知識介紹課件_第5頁
已閱讀5頁，還剩25頁未讀， 繼續免費閱讀

下載本文檔

版權說明：本文檔由用戶提供并上傳，收益歸屬內容提供方，若內容存在侵權，請進行舉報或認領

文檔簡介

HTML+CSS

初識web前端和HTML1HTML+CSS

初識web前端和HTML1知識導入本節任務什么是Web前端Web前端開發工具瀏覽器的介紹HTML是什么HTML的文檔結構W3c介紹Html發展史Xhtml1.0規范常用標簽的講解屬性的講解2知本節任務什么是Web前端2知識講解Web前端開發語言介紹Web前端：瀏覽器展現給用戶的所有東西(設計+布局+特效+交互)Web前端的發展：隨著時代的發展，在這樣一個“體驗至上、視覺為王”的時代，現在的互聯網產品不再是以前那樣只追求功能的實現，不在乎視覺效果及用戶體驗。基于這樣的時代需求，Web前端在產品組成中起到了舉足輕重的作用。職業方向：網站開發(PC+移動)、游戲制作、App開發…開發語言：html+css+javascript3知Web前端開發語言介紹Web前端：瀏覽器展現給用戶的所有東知識講解開發工具介紹三種常用的IDE：Dreamweaver、HBuilder、Webstorm建議使用HBuilder=>速度快，代碼提示好，基于eclipse開發，兼容所有eclipse有的插件4知開發工具介紹三種常用的IDE：Dreamweaver、H知識講解瀏覽器的介紹IE瀏覽器：IE6—IE8存在兼容性問題，js引擎的性能不好Chrome瀏覽器：兼容性及js引擎性能都很好FF瀏覽器：兼容性很好，js引擎性能不如chrome，而且首次打開特別慢注意：開發調試建議使用Chrome瀏覽器5知瀏覽器的介紹IE瀏覽器：IE6—IE8存在兼容性問題，js知識講解HTML文檔結構1.HTML是什么Html是超文本標記語言Html使用標記來描述網頁Html文件的后綴名是.html或者是.htmHtml文件不需要編譯，直接由瀏覽器解析執行2.HTML的基礎語法Html語法是由標簽組成的=>標記=標簽=元素=節點Html標簽分為雙標簽和單標簽Html標簽不區分大小寫，推薦使用小寫6知HTML文檔結構1.HTML是什么Html是超文本標記知識講解HTML文檔結構<!DOCTYPEHTML><html> <head></head> <body>helloworld</body></html><!DOCTYPEHTML>網頁的DTD聲明，告訴瀏覽器按照指定的標準來解析網頁，這里指的是w3c標準。如果不寫DTD聲明，瀏覽器認為這是一個不太“標準”的網頁，就會以“奇怪模式”來顯示這個網頁。7知HTML文檔結構<!DOCTYPEHTML><!DOC知識講解W3c介紹W3c萬維網聯盟，專門制定和維護web標準的組織萬維網聯盟創建于1994年，是Web技術領域最具權威和影響力的國際中立性技術標準機構。到目前為止，W3C已發布了200多項影響深遠的Web技術標準及實施指南，如廣為業界采用的超文本標記語言、可擴展標記語言以及幫助殘障人士有效獲得Web內容的信息無障礙指南（WCAG）等，有效促進了Web技術的互相兼容，對互聯網技術的發展和應用起到了基礎性和根本性的支撐作用。8知W3c介紹W3c萬維網聯盟，專門制定和維護web標準的組知識講解Html發展史HTML1.0–草案 在1993年6月發為互聯網工程工作小組(IETF)工作草案發布(并非標準)HTML2.0–

1995年11月作為RFC1866發布,在RFC2854于2000年6月發布之后被宣布已經過時HTML3.2–

1996年1月14日,W3C推薦標準HTML4.0–

1997年12月18日,W3C推薦標準HTML4.01(微小改進)–

1999年12月24日,W3C推薦標準XHTML1.0– 發布于2000年1月26日,是W3C推薦標準,后來經過修訂于2002年8月1日重新發布XHTML1.1– 于2001年5月31日發布XHTML2.09知Html發展史HTML1.0–草案9知識講解xhtml1.0介紹xhtml就是標準更嚴格的html版本，增強了一些規范和限制xhtml可以理解成就是html的加強版xhtml好處是增強了程序的可讀性頁面必須具有DTD聲明img必須加alt雙標簽必須閉合，單標簽由反斜線(/)封閉引號必須用雙引號標簽名與屬性名必須小寫xhtml1.0規范10知xhtml1.0介紹xhtml就是標準更嚴格的html知識講解Xhtml發展史1993年(IETF)HTML1.01995(W3C)HTML2.01996(W3C)HTML3.21997(W3C)HTML4.01999(W3C)HTML4.012000(W3C)XHTML1.02001(W3C)XHTML1.1XHTML2.0?分歧2004年(WHATWG)HTML5草案2008年(合并)HTML52014年HTML5正式版分化點11知Xhtml發展史1993年(IETF)1995(W3C)知識講解常用標簽的介紹h1–h6雙標簽標題<h5>文章標題</h5>注：h1只可以出現一次，h2-h6可以多次出現P雙標簽段落<p>文章內容</p>12知常用標簽的介紹h1–h6雙標簽標題P雙標簽知識講解常用標簽的介紹a雙標簽超鏈接<ahref="地址"title="提示文字"target="打開方式">超鏈接標題</a>屬性的介紹用來表示該標簽的性質和特性，通常格式=>屬性名="屬性值"

在開始標簽中指定多個屬性用空格隔開13知常用標簽的介紹a雙標簽超鏈接屬性的介紹用來表示該標知識講解常用標簽的介紹img單標簽圖片<imgsrc="圖片路徑"alt="替換文本"width="寬度"

height="高度"

/>注意：

1.alt只有當地址路徑錯誤的時候才顯示 2.width/height只給一個值的時候另一個值瀏覽器默認會算 出來，等比例縮放 3.圖片名稱不可以出現中文14知常用標簽的介紹img單標簽圖片注意：14知識講解元素樣式的介紹<h5

style=“color:red”>文章標題</h5>注意：

1.style屬性規定元素的行內樣式(行間樣式) 2.style樣式內部寫法=>屬性名:屬性值=>多個屬性用分號隔開

3.color文字的顏色，值有三種形式=>十六進制，rgb，英文15知元素樣式的介紹<h5style=“color:red”>HTML+CSS

初識web前端和HTML16HTML+CSS

初識web前端和HTML1知識導入本節任務什么是Web前端Web前端開發工具瀏覽器的介紹HTML是什么HTML的文檔結構W3c介紹Html發展史Xhtml1.0規范常用標簽的講解屬性的講解17知本節任務什么是Web前端2知識講解Web前端開發語言介紹Web前端：瀏覽器展現給用戶的所有東西(設計+布局+特效+交互)Web前端的發展：隨著時代的發展，在這樣一個“體驗至上、視覺為王”的時代，現在的互聯網產品不再是以前那樣只追求功能的實現，不在乎視覺效果及用戶體驗。基于這樣的時代需求，Web前端在產品組成中起到了舉足輕重的作用。職業方向：網站開發(PC+移動)、游戲制作、App開發…開發語言：html+css+javascript18知Web前端開發語言介紹Web前端：瀏覽器展現給用戶的所有東知識講解開發工具介紹三種常用的IDE：Dreamweaver、HBuilder、Webstorm建議使用HBuilder=>速度快，代碼提示好，基于eclipse開發，兼容所有eclipse有的插件19知開發工具介紹三種常用的IDE：Dreamweaver、H知識講解瀏覽器的介紹IE瀏覽器：IE6—IE8存在兼容性問題，js引擎的性能不好Chrome瀏覽器：兼容性及js引擎性能都很好FF瀏覽器：兼容性很好，js引擎性能不如chrome，而且首次打開特別慢注意：開發調試建議使用Chrome瀏覽器20知瀏覽器的介紹IE瀏覽器：IE6—IE8存在兼容性問題，js知識講解HTML文檔結構1.HTML是什么Html是超文本標記語言Html使用標記來描述網頁Html文件的后綴名是.html或者是.htmHtml文件不需要編譯，直接由瀏覽器解析執行2.HTML的基礎語法Html語法是由標簽組成的=>標記=標簽=元素=節點Html標簽分為雙標簽和單標簽Html標簽不區分大小寫，推薦使用小寫21知HTML文檔結構1.HTML是什么Html是超文本標記知識講解HTML文檔結構<!DOCTYPEHTML><html> <head></head> <body>helloworld</body></html><!DOCTYPEHTML>網頁的DTD聲明，告訴瀏覽器按照指定的標準來解析網頁，這里指的是w3c標準。如果不寫DTD聲明，瀏覽器認為這是一個不太“標準”的網頁，就會以“奇怪模式”來顯示這個網頁。22知HTML文檔結構<!DOCTYPEHTML><!DOC知識講解W3c介紹W3c萬維網聯盟，專門制定和維護web標準的組織萬維網聯盟創建于1994年，是Web技術領域最具權威和影響力的國際中立性技術標準機構。到目前為止，W3C已發布了200多項影響深遠的Web技術標準及實施指南，如廣為業界采用的超文本標記語言、可擴展標記語言以及幫助殘障人士有效獲得Web內容的信息無障礙指南（WCAG）等，有效促進了Web技術的互相兼容，對互聯網技術的發展和應用起到了基礎性和根本性的支撐作用。23知W3c介紹W3c萬維網聯盟，專門制定和維護web標準的組知識講解Html發展史HTML1.0–草案 在1993年6月發為互聯網工程工作小組(IETF)工作草案發布(并非標準)HTML2.0–

1995年11月作為RFC1866發布,在RFC2854于2000年6月發布之后被宣布已經過時HTML3.2–

1996年1月14日,W3C推薦標準HTML4.0–

1997年12月18日,W3C推薦標準HTML4.01(微小改進)–

1999年12月24日,W3C推薦標準XHTML1.0– 發布于2000年1月26日,是W3C推薦標準,后來經過修訂于2002年8月1日重新發布XHTML1.1– 于2001年5月31日發布XHTML2.024知Html發展史HTML1.0–草案9知識講解xhtml1.0介紹xhtml就是標準更嚴格的html版本，增強了一些規范和限制xhtml可以理解成就是html的加強版xhtml好處是增強了程序的可讀性頁面必須具有DTD聲明img必須加alt雙標簽必須閉合，單標簽由反斜線(/)封閉引號必須用雙引號標簽名與屬性名必須小寫xhtml1.0規范25知xhtml1.0介紹xhtml就是標準更嚴格的html知識講解Xhtml發展史1993年(IETF)HTML1.01995(W3C)HTML2.01996(W3C)HTML3.21997(W3C)HTML4.01999(W3C)HTML4.012000(W3C)XHTML1.02001(W3C)XHTML1.1XHTML2.0?分歧2004年(WHATWG)HTML5草案2008年(合并)HTML52014年HTML5正式版分化點26知Xhtml發展史1993年(IETF)1995(W3C)知識講解常用標簽的介紹h1–h6雙標簽標題<h5>文章標題</h5>注：h1只可以出現一次，h2-h6可以多次出現P雙標簽段落<p>文章內容</p>27知常用標簽的介紹h1–h6雙

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網頁內容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
  • 4. 未經權益所有人同意不得將文件中的內容挪作商業或盈利用途。
  • 5. 人人文庫網僅提供信息存儲空間，僅對用戶上傳內容的表現方式做保護處理，對用戶上傳分享的文檔內容本身不做任何修改或編輯，并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容，請與我們聯系，我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論