JavaEE學習之路階段一JavaScript教程 html基礎知識

一、HTML的概述(瞭解)

a.html是什麼 : hypertext markup language 超文本標記語言
	   超文本:音頻,視頻,圖片稱爲超文本。.
	   標記 :<英文單詞或者字母>稱爲標記. 一個HTML頁面都是由各種標記組成。
b.作用:編寫HTML頁面。
c.HTML語言不是一個編程語言(有編譯過程),而是一個標記語言(沒有編譯過程).
        HTML頁面直接由瀏覽器解析執行。 

二、HTML的歷史(瞭解)

三、HTML的網絡術語(明白)

網頁 :由各種標記組成的一個頁面就叫網頁 .
主頁(首頁) : 一個網站的起始頁面或者導航頁面 .
標記:<p>稱爲開始標記  </p>稱爲結束標記. 也叫標籤.每個標籤都規定好了特殊的含義。
元素:<p>內容</p> 稱爲元素.
屬性: 給每一個標籤所做的輔助信息。
xhtml: 符合XML語法標準的HTML。
dhtml:dynamic,動態的。javascript + css + html 合起來的頁面就是一個dhtml
http:協議標準。用來規定客戶端瀏覽器和服務端交互時數據的一個格式。SMTP 郵件傳輸協議,ftp:文件傳輸協議.

四、HTML的編輯工具(瞭解)
*notepad 記事本
* editplus : 語法高亮顯示
技巧: 根據顏色判斷單詞是否出錯。 (不是100%)
*ultraedit : 根據顏色判斷單詞是否出錯,可以顯示2進制數據.
*.dw(dreamweaver,專業工具) 代碼提示.

五、HTML的規範(知道)
*.HTML是一個弱勢語言
*.html 不區分大小寫
*.html頁面的後綴名是html或者htm(有一些系統不支持後綴名長度超過3個字符,比如dos系統)
*.html 的結構
1)聲明部分。主要作用是用來告訴瀏覽器這個頁面使用的是那個標準。<!doctype html>是HTML5標準。
2)head部分: 不會顯示在頁面上。作用是告訴瀏覽器一些頁面的額外信息。
3)body部分:我們縮寫的代碼必須放在此標籤內。

六、HTML的各種標籤(掌握)
明確:每個標籤都有私有屬性。也都有公有屬性。
html中表示長度的單位都是像素。HTML只有一種單位就是像素。
body:
bgcolor: 背景顏色
background:背景圖片
text: 文本顏色

1.排版標籤
所有的瀏覽器默認情況下都會忽略空格和空行
P:p代表一個段落
屬性: align:對齊方式. 取值:left,right,center

代表是換行。
hr:
color: 線的顏色
size : 線的粗細
width: 線的長短
兩種寫法: 1) 絕對值 eg: 500
2) 相對值: 50%
noshade: 不要陰影
align: 對齊方式 取值: left,right,center

	center: 內容居中
	pre: 預定義格式標籤 .告訴瀏覽器不要忽略空格和空行
	div: 塊級標籤  必須單獨佔據一行
		   屬性: align :
	span: 塊級標籤 不換行字體標記    

2 字體標籤
h1…h6:定義字體大小
屬性: align :居中
font:
color:字體顏色
顏色的寫法有3種: 1)英文單詞: red
2)十六進制:#00ffcc
3)RGB(三原色) : new RGB(124,156,23)
size:字體大小
face:字體類型

特殊字符: &lt;小於 &gt;大於 &amp; &符號 &quot; 雙引號&apos;單引號
					   &copy; 版權 &trade;商標 &nbsp;空格
					   擴展:&#32464; 
				   
	b: 加粗
	strong: 加粗
	i:斜體
	em: 斜體
	u: 下劃線
	s: 中劃線(刪除線)
	sup: 上標
	sub: 下標.    

3.圖像標記
img: 代表是一副圖片
屬性: src : 圖片的路徑
兩種寫法:a) : 相對路徑 路徑是相對頁面所在的路徑 兩個標記.和… ,分表代表當前目錄和父路徑
b) :絕對路徑
1) : 以盤符開始的路徑
eg: C:\Documents and Settings\Administrator\桌面\day01_html\上課示例/images/1.jpg
2) : 網絡路徑
eg: http://www.baidu.com/images
width: 寬度
height:高度
Alt:當圖片顯示不出來的時候代替圖片顯示的內容
title: 提示性文本
border: 邊框
熱點: 就是特定的位置添加超鏈。

                 <img src="images/1.jpg" width="300" height="300" usemap="#Map" border="0" />
					<map name="Map" id="Map">
						<area shape="circle" coords="122,81,38" href="demo_字體標籤.html" />
					</map>

4.清單標記
列表標籤:3種
a.無序列表ul
屬性:type : 值: disc(默認,實心原點),square(實心方點),circle(空心圓)
b.有序列表(OL)
屬性: type:取值:1(阿拉伯數字,默認),a,A,i,I
start: 從幾開始
c.定義列表(dl)
dt: 列表項的標題
dd: 列表項
5.超鏈接
3種超鏈接:
1. 連接到其他頁面
2. 錨: 指給超鏈接起一個名字,作用是連接到本頁面或者其他頁面的特定位置。使用name屬性給超鏈起名字
3. 連接到郵件: <a href = "mailto:[email protected]">進入我的郵箱</a>
屬性:target: 告訴瀏覽器怎麼顯示目標頁面
HTML中已定義4個值: _self :在同一個瀏覽器中顯示
_blank: 打開新的瀏覽器顯示
_parent: 在父窗口中顯示
_top: 在頂級窗口中顯示
6.表格標記
table: 表格
屬性:border:邊框
width:寬度
height:高度
align:表格的對齊方式
cellpadding:單元格內容到邊的距離
cellspacing:單元格和單元格之間的距離
bgcolor:背景顏色
background:背景圖片
bordercolorlight:表格的上,左邊框,以及單元格的右,下邊框的顏色
bordercolordark: 表格的右,下邊框,以及單元格上,左的邊框的顏色
dir:單元格內容的排列方式 取值:ltr 從左到右, rtl:從右到左
tr: 行
屬性:dir:
bgcolor:
td: 單元格
屬性: align: 內容的橫向對齊方式
valign: 內容的縱向對齊方式 top,middle,bottom
width: 絕對值或者相對值(%)
height:單元格的高度

	單元格的合併:
	      單元格的屬性:
		      colspan: 橫向合併
			  rowspan: 縱向合併
	 th: 相當於<td> + <b>
	    屬性同<td>
	caption: 表格的標題
	   屬性:align: 取值:left,center,right,top,bottom
	thead
	tbody
	tfoot
	   寫與不寫的區別: 
	           1. 當表格非常大的時候,如果不寫,則必須等表格的內容全部下載完成才能顯示。但是用tbody標籤的話,那麼邊下載邊顯示。					2.如果不寫thead,tbody,tfoot那麼瀏覽器解析表格內容的時候是從上到下解析。如果寫了,那麼順序任意,瀏覽器解析的時候還是按照thead,tbody,tfoot的順序顯示內容
  1. 框架標記及<iframe>
    框架頁面上不允許有body標籤
    frameset: 框架的集合
    rows: 縱向分部框架.
    cols: 橫向分部框架.
    寫法有兩種: 1) 絕對值 “200,*” ,代表剩餘的
    2) 相對值 "30%,
    "
    frame: 框架. 一個框架顯示一個頁面
    scrolling: 是否需要滾動條。默認是true
    noresize : 固定框架大小
    bordercolor: 給框架邊框起一個顏色
    name : 給框架起一個名字
    內嵌框架: 嵌入在一個頁面上的框架.(僅僅IE支持)
    iframe:
    屬性: width: 寬度
    height: 高度
    scrolling : 是否需要滾動條
    8.表單標記及語義化

9.多媒體標記
bgsound: 背景音樂
embed: 播放多媒體文件.
marquee: 移動
屬性:direction 移動目標方向 left,right ,up,down ,up,down移動距離是固定的200px
behavior: 行爲方式 取值:slide,alternate,scroll
scrollamount : 移動速度
loop: 循環多少圈。負值表示無限循環
scrolldelay: 移動一次休息多長時間。單位是毫秒
10.頭標記

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章