2014V20101 HTML5入門

1、HTML5內(nèi)容概要內(nèi)容概要l HTML5發(fā)展史l 網(wǎng)站的基本組成l 網(wǎng)頁制作與開發(fā)的基本流程l 網(wǎng)站布局l狹義的HTML5l廣義的HTML5lHTML5的技術(shù)概括lHTML5行業(yè)HTML5HTML5是什么？是什么？HTML5HTML5的歷程的歷程網(wǎng)站的基本組成網(wǎng)站的基本組成l 網(wǎng)站基本組成l 相應職位網(wǎng)頁開發(fā)流程網(wǎng)頁開發(fā)流程l 如何開發(fā)一個網(wǎng)頁？布局的基本知識布局的基本知識l Table布局模式l DIV+CSS的布局發(fā)展l 不同布局的基本辨析布局用標簽布局用標簽l div何何為為CSSCSSCSS（cascading Style Sheet 的縮寫），可譯為層疊樣式表或級聯(lián)樣式表，是一組格式

2、設置規(guī)則，用于控制 web 頁面的外觀。l CSSCSS思索思索l 課程安排1.沒有CSS的網(wǎng)頁是什么樣子的？2.根據(jù)對頁面的分析，CSS是為了什么而誕生的？3.在進行代碼實現(xiàn)和學習后，能夠總結(jié)出CSS具有的特點（優(yōu)勢）CSS引入方式引入方式l CSS 的引入方式標簽內(nèi)書寫直接在標簽里面加 style 樣式客戶需求客戶需求l 維護人員更新，滿足客戶的變態(tài)需求l CSS 的引入方式外部引入在部分加入標簽，引入外部css文件。head 頭部引入在部分加入標簽，在標簽內(nèi)部書寫樣式。CSS引入方式引入方式CSS引入方式引入方式l 不同引入方式的優(yōu)勢和劣勢CSS重置重置l CSS resetCSSCSS

3、選擇器語法選擇器語法l CSS 基礎語法選擇器屬性：值；屬性：值；選擇器通常是需要改變樣式的 HTML 元素。每條聲明由一個屬性和一個值組成，每個屬性有一個值。 屬性和值用冒號分開，分號結(jié)束CSSCSS選擇器的分類選擇器的分類l CSS 常用選擇器1.ID選擇器2.類名選擇器3.標簽名選擇器從選擇范圍和精準度的角度進行比較考慮哪種屬性是可以設置的IDID選擇器選擇器lID 選擇器語法頁面中不能有同名的 ID# 后跟 ID 名l類選擇器語法可以有相同的類名. 后跟類名標簽名選擇器標簽名選擇器l標簽名選擇器語法直接使用標簽名作為選擇器CSSCSS自身屬性自身屬性CSS自身屬性：盒模型width寬height高margin外邊距padding內(nèi)邊距border邊框外邊距及內(nèi)邊距的使用范圍、縮寫方式、特殊用法CSSCSS自身屬性自身屬性CSSCSS背景顏色背景顏色lbackground - color background-color: red | #ffffff | #fcc | rgb | rgba； 顯示屬性顯示屬性lfloat: none | left | right ;l float 先浮后動（水槽原理） 所有的元素都可以浮動 具有float