步驟一網(wǎng)頁搭建入門之與css01_第1頁
步驟一網(wǎng)頁搭建入門之與css01_第2頁
步驟一網(wǎng)頁搭建入門之與css01_第3頁
步驟一網(wǎng)頁搭建入門之與css01_第4頁
步驟一網(wǎng)頁搭建入門之與css01_第5頁
已閱讀5頁，還剩26頁未讀， 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡介

1、HTML課程目標(biāo)l Sublime使用方法及其開發(fā)HTMLl HTML必須掌握的及屬性l 掌握使用表格進(jìn)行各類型數(shù)據(jù)展示的方法l 掌握利用表單進(jìn)行交互式頁面設(shè)計(jì)的方法l 使用本課程所學(xué)技術(shù)完成綜合練習(xí)課程安排 SublimeHTML頁面安裝、使用方法、開發(fā)環(huán)境、第一個(gè)準(zhǔn)備工作 HTML字體、段落、標(biāo)題、注釋、超#、# 基本table用法、列表、常用表格設(shè)計(jì)表單設(shè)計(jì)綜合作業(yè) 文本框、單選、復(fù)選、隱藏域、列表框、圖片框 利用表單和table實(shí)現(xiàn)頁面布局開發(fā)環(huán)境l 瀏覽器：Chrome瀏覽器FireFox瀏覽器l 開發(fā)工具：Sublime3準(zhǔn)備工作l 在瀏覽器中輸入l 或者，在瀏覽器中輸入瀏覽器左下

2、角顯示的效果瀏覽器左下角顯示的效果HTML簡介l 什么是HTML大名：Hyper Text Markup Language寓意：超文本標(biāo)記語言用Sublime開發(fā)第一個(gè)HTML頁面l 設(shè)置文件擴(kuò)展名為顯示狀態(tài)l 創(chuàng)建文件夾及必須的文件l 打開Sublime進(jìn)行頁面設(shè)計(jì)HTML文件結(jié)構(gòu)<font></font>字體規(guī)定文本的字體、字體、字體顏色作用<font size="3" color="red">我是紅色</font>示例在 HTML 4 中，不贊成使用該在 HTML 5 中，不支持該小貼士<p&g

3、t;</p>段落定義一個(gè)段落作用<p>我是段落</p>示例段落內(nèi)依據(jù)所在容器的寬度自動(dòng)換行 瀏覽器會(huì)自動(dòng)地在段落的前后添加空行<p>和<br>的區(qū)別小貼士<!- ->注釋編寫程序時(shí)，給代碼的解釋或提示,能提高程序代碼的可讀性,以便于以后的參考、修改<!-這里是注釋，是作者對(duì)程序代碼做的解釋說明，以增加代碼可讀性->作用示例注釋在瀏覽器中進(jìn)行顯示小貼士注釋出現(xiàn)的頻率非常高h(yuǎn)：<h？></h？>標(biāo)題定義標(biāo)題頭的六個(gè)不同文字大小，依次顯示重要性的遞減，也就是權(quán)重依次降低。<h1>我

4、是<font color="red">1</font>級(jí)標(biāo)題</h1>作用示例盡量靠近在html 中的<body> 以便讓搜索引擎最快的領(lǐng)略主題，越近越好，小貼士<img src=“*”/>img在瀏覽器顯示圖片作用<img src=“image/logo.jpg”alt=“*” />示例src、alt、height、width常用屬性<a></a>a使用超級(jí)與網(wǎng)絡(luò)上的另一個(gè)文檔相連作用<a href="page2.html">打開另一個(gè)頁面<

5、;/a>示例超可以是一個(gè)字，一個(gè)詞，或者一組詞，也小貼士可以是一幅圖像，您可以點(diǎn)擊這些內(nèi)容來跳轉(zhuǎn)到新的文檔或者當(dāng)前文檔中的某個(gè)部分<a name="ziti"> </a>同一個(gè)文檔中創(chuàng)建指向該錨（位置）的作用<a href="#duanluo">段落</a>示例必須先定義，在使用小貼士<ul><li></li></ul>無序列表此列項(xiàng)目使用粗體圓點(diǎn)（典型的小黑圓圈）進(jìn)行標(biāo)記作用<ul><li>文件</li></u

6、l>示例列表項(xiàng)以使用段落、換行符、圖片、小貼士以及其他列表等<ol><li></li></ol>有序列表列表項(xiàng)目使用數(shù)字進(jìn)行標(biāo)記作用<ol><li>文件</li></ol>示例列表項(xiàng)以使用段落、換行符、圖片、小貼士以及其他列表等階段小結(jié)格式段落<p>字體<font>標(biāo)題h1h6列表ul、ol、li超<a href="*"></a><a name="ziti"> </a><a h

7、ref="#duanluo">段落</a>注釋<!- ->table、tr、td、border、width表格用于表格、行、列、寬度、邊框的制作作用小貼士制作課程表colspan 、rowspan合并行列用于將表格內(nèi)的某些行、列進(jìn)行合并作用合并午休、兩節(jié)連上等表格位置例題其他屬性名稱屬性值作用border1設(shè)置邊框widthnpx，n%表格寬度bgcolor顏色值表格背景alignleft、center、right表格在文檔中的對(duì)齊方式valignbottom、middle、top三種垂直對(duì)齊方式練表 單Why？什么是表單？表單作用用于收集用戶信息，進(jìn)行人機(jī)交互操作文本框、單選按鈕、列表框、圖片框、復(fù)選框等這些元素，統(tǒng)稱“控件”包含元素示例示例控件的常用屬性屬性作用name指定控件的名稱，可重復(fù)id指定的唯一標(biāo)識(shí)value輸入(收集、設(shè)置)控件的值checked復(fù)選框(單選)組默認(rèn)被選中的項(xiàng)目selected列表框組默認(rèn)被選中的項(xiàng)目src圖片框的圖片來源onclick鼠標(biāo)單擊.disabled禁用該控件multiple多選（適合普通列表框）頁面優(yōu)化l 優(yōu)化對(duì)齊方式

溫馨提示

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

評(píng)論

0/150

提交評(píng)論