案例1-**資訊展示
需求:在頁面展示一些文字資訊,需要排版
技術分析:
html:超文字標籤語言
html:
作用:展示
超文字:超越了一般文字,描述文字的字型 顏色
標籤:標記
html書寫規則:
檔案的字尾名 .html(建議) 或者 .htm
標籤必須用 <> 引起來 已經定義好的標籤
屬性 格式: key="value"
建議屬性的值用引號引起來.
不區分大小寫
注意:最好將所有的內容放在乙個標籤中
有開始標籤和結束標籤的標籤稱之為圍堵標籤
沒有結束的標籤的稱之為空標籤
開始標籤和結束標籤之間的內容稱之為標籤體.
html頁面中的注釋
標籤必須正常巢狀,
標籤最好關閉
檔案標籤:
html標籤:
宣告當前網頁為html頁面
子標籤:
head:用來存放當前頁面的重要資訊,一般不展示在html頁面上
常見的子標籤:
網頁的標題
body:
要展示的資料放在body中
標題標籤:
n取值 :1~6
h1最大 h6最小
自動換行 且留白 預設加粗
常用屬性:
align:對齊方式
left:左 right:右 center:居中
格式://
字型標籤:(了解)規定文字的字型、字型尺寸、字型顏色。
常用屬性:
face:字型
size:尺寸
color:顏色
顏色的取值:(rgb)
方式1: #****** x為16進製制
方式2: 英文單詞
段落標籤:
其他標籤:
加粗
斜體水平線
換行//
案例1-步驟分析:
1.新建乙個html頁面
2.標題標籤
3.新增乙個水平線
4.4個段落
5.新增字型顏色 加粗 斜體
/案例2-網頁展示
需求:在乙個頁面中展示多張
技術分析:
標籤:★
常用屬性:
★src:的路徑
alt:替代文字
title:移上去顯示的文字
width:寬
height:高
大小的寫法:
畫素:123px
百分比:20%
路徑的寫法:
相對路徑:
./ 或者 什麼都不寫 當前目錄
../ 上一級目錄
絕對路徑:
帶協議的絕對路徑:
實現:案例3-列表頁面展示
需求:將友情連線的頁面通過列表展示出來
技術分析:
列表標籤
列表標籤:
有序 無序
常用的標籤
列表項超連結標記
常用屬性:
href:跳轉路徑
target:在那裡開啟
預設值:_self _blank(在空白頁面開啟)
案例4-首頁資訊的展示
需求:通過**布局將首頁資訊展示
技術分析:
****
**標籤★
常用的子標籤
:行常用子標籤:
:列:表頭單元格 預設居中加粗
注意:一行必須只有有乙個單元格或者一列
//table 的常用屬性:
border:邊框 畫素值
width:
align:**對齊方式
tr 的常用屬性:
align:內容對齊
td 的常用屬性:
align:內容對齊
colspan:跨列合併 值:合併的列數
rowspan:跨行合併
步驟分析:
1.常見乙個8行1列的**
2.在第一行 放logo
巢狀乙個1行3列的**
3.第2行 放選單
4.第3行 放
5.第4行 熱門商品
巢狀乙個2行7列的**
6.第5行 放廣告
7.第6行 最新商品
巢狀乙個2行7列的**
8.第7行 放乙個
9.第8行
兩個段落
///案例5-表單頁面
需求:設計乙個表單頁面,用來收集使用者的資料
技術分析:
表單標籤
表單標籤★★★
作用:用來從瀏覽器端收集使用者的資訊.
步驟分析:
1.在頁面中間新增乙個**
2.10行3列**
3.在**中新增表單表單子標籤
/案例6-後台管理頁面(了解)
需求:開發乙個後台管理頁面,通過frameset實現
技術分析:
frameset:框架集
frame:具體實現
frameset:框架集(了解)
常用屬性:
cols:垂直切割
例如: cols="40%,60%"
例如: cols="40%,*,10%"
rows:水平切割
常見的子標籤:
frame
注意:最好和body不要共存
frame:具體實現
常用屬性:
src:展示的頁面的url
//補充:
轉義字元:
三部分構成 &實體;
掌握的轉義字元:
>
> //great then
<
<&&
空格
//meta
元資訊指定瀏覽器用什麼編碼開啟此頁面///
上午回顧:
html
檔案標籤:
排版標籤:pbr
hr字型
font
h1~h6
bstrongi★
***x
列表列表項
**標籤★★
td中的重要屬性:
colspan:列合併
rowspan:行合併
表單標籤★★★
form
常用屬性:
action:提交路徑
method:提交方式 get和post
常見的子標籤:
input
select
textarea
input標籤:
10中type
text
password
radio
checkbox
file
submit
reset
button
hidden
image
若想將內容傳送到伺服器,必須有name屬性 username=tom
select標籤:
展示內容
textarea:文字域
格式:框架(了解)
frameset:定義框架集
常用屬性:
cols:
rows:
常見的子標籤:
frame
frame:具體展示
常用屬性:
src:展示網頁的url
name:給當前的frame起個名稱
HTML學習筆記
2004 9 9 星期四 陰 hello world 整個頁面分成三部分 1 一行包括html版本資訊的內容 2 報頭申明區域 3 頁面主要部分，包括頁面的實際內容。2.基本的html標記 答 1 headings 標題 2 paragraphs 段落 this is a paragraph 3 l...
HTML學習筆記
html 是一種超文字標記語言，它是由標籤組成的。html 中的資料都封裝在標籤中，通過對標籤中的屬性值的改變來實現對封裝內資料進行操作。html規範格式 首先要確定html 的 範圍 在該範圍中可以定義兩個部分，乙個是頭乙個是體。這中間寫網頁顯示的資料 標籤對資料進行封裝那麼就有開始標籤和結束標籤...
學習html筆記
簡介 基礎 1 html鏈結是通過標籤 來定義的.這是乙個鏈結 href是屬性 2 html 影象是通過標籤 屬性 html 元素可以設定 屬性 屬性可以在元素中新增 附加資訊about an element 屬性一般描述於 開始標籤 屬性總是以名稱 值對的形式出現，比如 name value th...