lession02--HTML語言基礎(chǔ)之文本.ppt

第2講HTML與DW,蘭晶,Dreamweaver基礎(chǔ),啟動和退出Dreamweaver8單擊“開始”按鈕，在開始菜單中依次選擇“程序”“Macromedia”“MacromediaDreamweaver8”，啟動Dreamweaver8程序。啟動Dreamweaver8后出現(xiàn)開始界面。,Dreamweaver8操作界面,網(wǎng)頁文件的基本操作,新建網(wǎng)頁菜單欄中“文件”|“新建”命令|標(biāo)準(zhǔn)工具欄上的按鈕“新建文檔”對話框中選擇“基本頁”選項(xiàng)中的“HTML”保存網(wǎng)頁菜單欄中“文件”|“保存”|標(biāo)準(zhǔn)工具欄上的按鈕關(guān)閉網(wǎng)頁菜單欄中“文件”|“關(guān)閉”|單擊文檔的窗口右上角的“”打開網(wǎng)頁菜單欄中的“文件”|“打開”|選中文件拖拽到DW中的標(biāo)簽欄預(yù)覽網(wǎng)頁菜單欄中“文件”|“在瀏覽器中預(yù)覽”|“Iexplore6.0”使用快捷鍵為F12在文檔工具欄中單擊，選擇在瀏覽器中預(yù)覽,插入文本,空格ctrl+shift+space硬回車enter軟回車shift+enter,練習(xí),P28圖2.6請使用DW編輯出這個故事新建一個頁面保存這個頁面設(shè)置頁面的標(biāo)題段落要分隔首行要空兩個漢字的距離,HTML語言基礎(chǔ),HTML（HyperTextMarkupLanguage）又稱超文本標(biāo)識語言，是一種標(biāo)識性的語言，是網(wǎng)頁設(shè)計(jì)的最初語言。文件的擴(kuò)展名:“html”或“htm”。簡單的HTML文檔你好！Hi,大家好！,HTML簡介,1圍堵標(biāo)記格式：2單標(biāo)記格式：只有起始標(biāo)記，沒有結(jié)束標(biāo)記。3標(biāo)記屬性格式：各屬性間無前后順序，屬性也可省略，當(dāng)省略屬性時取標(biāo)記的默認(rèn)值。,完整的HTML標(biāo)記放在“”內(nèi)頁面內(nèi)容要放入頁面內(nèi)的文本、圖像、多媒體文件等,HTML文檔的基本結(jié)構(gòu)：文件開始標(biāo)頭區(qū)開始.標(biāo)題區(qū)標(biāo)頭區(qū)結(jié)束文件主體內(nèi)容開始文件主體內(nèi)容文件主體內(nèi)容結(jié)束文件結(jié)束其中之間表示這是個網(wǎng)頁文件，是必有的標(biāo)記。,HTML語法結(jié)構(gòu),人,頭,頭軀干,姓名,標(biāo)簽的嵌套,一個標(biāo)簽必須是嵌套在另一個標(biāo)簽內(nèi)使用的。大小括號原則P18,練習(xí),請?jiān)囍鴮懗鲆粋€標(biāo)準(zhǔn)的html文件，其文件的標(biāo)頭為自己的名字，內(nèi)容為自己的愛好。,TomMynameisTom.Ilike,空格,空格的HTML碼為,段落標(biāo)記,段落標(biāo)記有兩種：和相當(dāng)于是軟回車，相當(dāng)于是硬回車，一個相當(dāng)于是兩個標(biāo)記的屬性中須掌握的是align屬性,有三個left/right/center例如：文字,練習(xí),P28圖2.6請使用記事本編輯出這個故事的html頁面設(shè)置頁面的標(biāo)題段落要分隔首行要空兩個漢字的距離,字體的設(shè)置,練習(xí),要求在DW中制作游子吟的頁面：設(shè)置標(biāo)題文字大小及顏色詩文題目為“標(biāo)題一”作者信息為“標(biāo)題三”作者姓名為斜體文本居中換行,游子吟作者：孟郊慈母手中線，游子身上衣。臨行密密縫，意恐遲遲歸。誰言寸草心，報(bào)得三春暉。,文本標(biāo)記,粗體.請?jiān)囍鴮懗鲂斌w我是粗體的HTML源碼，若下劃線的標(biāo)記是u,則請?jiān)囍鴮懗鑫沂窍聞澗€的HTML源碼我是粗體我是粗體我是下劃線,文本標(biāo)記,斜體.請?jiān)囍鴮懗鲂斌w我是斜體的HTML源碼我是斜體我是斜體,標(biāo)題顯示等級語法格式為：n：表示不同級別的標(biāo)題，n值可以是1-6中的任意數(shù)字，其中1表示的標(biāo)題字體最大?？梢杂胊lign屬性設(shè)置對齊方式，常用的有左對齊，居中，右對齊三種對齊方式。,文本標(biāo)記,練習(xí),要求在記事本中制作出頁面：設(shè)置標(biāo)題文字大小及顏色詩文題目為“標(biāo)題一”作者信息為“標(biāo)題三”作者姓名為斜體文本居中換行,游子吟作者：孟郊慈母手中線，游子身上衣。臨行密密縫，意恐遲遲歸。誰言寸草心，報(bào)得三春暉。,文本標(biāo)記,字體標(biāo)記Size：設(shè)置字體的顯示字號，范圍是從“17”，其中“3”是默認(rèn)值。Color：設(shè)置文本的顏色，值可以是顏色名（英文如red代表紅色）或顏色的十六進(jìn)制代碼（#000000代表黑色，#FFFFFF代表白色）。Face：設(shè)置文本顯示的字體，值為字體的名稱。例：紅色PS:HTML5中不支持。,設(shè)置整個頁面的字體,文本標(biāo)記,特殊字符(P42表3-2)HTML中除了我們上面學(xué)的的一些標(biāo)記外，還有一些我們常用的特殊字符比如“”，這些特殊字符在HTML語言中都有對的轉(zhuǎn)義符，常用的轉(zhuǎn)義符與特殊字符參見下表：,文本標(biāo)記,上標(biāo)與下標(biāo)上標(biāo).下標(biāo)請?jiān)囍鴮懗?1)我是最新消息new其中new要求為紅色且為粗斜體(2)a1+a2=b1的HTML源碼我是最新消息newa1+a2=b1,練習(xí),請?jiān)谏弦粋€練習(xí)的基礎(chǔ)上寫出作者朝代的HTML源碼：朝代為藍(lán)色上標(biāo),游子吟作者：孟郊(唐)慈母手中線，游子身上衣。臨行密密縫，意恐遲遲歸。誰言寸草心，報(bào)得三春暉。,水平線標(biāo)記水平線是在網(wǎng)頁上劃出一條水平的分割線，用來標(biāo)記水平線。語法格式為：Size：設(shè)置水平線的高度，以像素為單位。Color：設(shè)置水平線的顏色。Width：設(shè)置水平線的寬度，單位是像素或百分比，像素是絕對大小，不會隨著程序窗口的大小而改，百分比是相對于程序窗口水平線所占的比例，會隨著程序窗口的大小而改變。Align：設(shè)置水平線的對齊方式。對齊方式有左對齊，居中，右對齊三種。,文本標(biāo)記,列表,在HTML中，列表常用的有“有序列表”和“無序列表”。,列表,1有序列表基本語法結(jié)構(gòu)為：項(xiàng)目1項(xiàng)目2項(xiàng)目n,type=“1”type=“a”type=“A”type=“i”type=“I”Start表示起始的數(shù)值,2無序列表基本語法結(jié)構(gòu)為：項(xiàng)目1項(xiàng)目2項(xiàng)目nType:設(shè)置符號形狀，有實(shí)心圓、小正方形、空心圓三種，具體如下：type=“disk”符號為實(shí)心圓。（默認(rèn)為disk）type=“square”符號為正方形。type=“circle”符號為空心圓。,上機(jī),P49制作一則通知會議標(biāo)題為2號標(biāo)題項(xiàng)目使用無序列表落款為右對齊頁