HTML知识点梳理
HTML超文本標記語言
結構分為頭部和主體
分別為<head></head>、<body></body><title></title>為網頁標題
<meta>標簽常用來描述網頁,定義網頁的一些基本信息
格式:
<meta http-equiv="Content-Type" content="text/html; charset =gb2312">
charset設置頁面顯示語言格式,可以避免頁面中的亂碼
頁面背景色或背景圖像
格式:
<body bgcolor ="#FFCCFF" background = "back_image.GIF">
bgcolor屬性為網頁背景色彩
background屬性網頁背景圖像
為了使頁面美觀大方,頁面背景盡量使用淺色
文本控制標簽
標題標簽,表示文章的標題
<h></h>標簽 h1到h6是不同的標
文本字體標簽
<font>控制文本的大小、顏色、字體
<font size="12" color="red" face="宋體"></font>
size 字體的大小值
color 字體的顏色
face 字體的類型
特殊符號 轉義符
空格  ;
引號("") "
小于(<) <
大于(>) >
版權號(?) ©
段落標簽
<p> 可以看做空行
換行標簽
<br>
文字布局標簽
內容分隔<hr>標簽
<hr size="5" color="red" width="300">
文字列表和編號
--有序列表<OL>
--無需列表<UL>
語法:
有序列表語法:
<OL>
<LI> XXXXX </LI>
<LI> XXXXX </LI>
<LI> XXXXX </LI>
<LI> XXXXX </LI>
</OL>
無序列表
<UL>
<LI> XXXXX </LI>
<LI> XXXXX </LI>
<LI> XXXXX </LI>
<LI> XXXXX </LI>
</UL>
?
預格式文本<PRE>標簽
<pre><img src = "QQ.jpg" width ="159" height="133" align="LEFT">
</pre>
超鏈接標簽
--鏈接到其他頁面
語法:
<a href="register/register.html">[免費注冊]</a>
<A>標簽錨標記
1.鏈接到本頁面
--錨記標簽用于使用戶“跳到文檔的某個部分”
--
HTML的NAME屬性用于創建錨標記
<A name="marker">主題名稱</A>
只定義Name屬性相當于定義一個位置
--為達到這種跳轉結果,請在HREF參數中使用該標記
<a href = "#marker">主題名稱</a>
<a>標簽錨標記示例
<html>
<head>
<title>鏈接到其他頁面</title>
</head>
<body>
<A href ="#helpme">[新人上路]</a>
<a name ="helpme">新人上路指南</a>
</body>
</html>
<A>標簽電子郵件鏈接
--要鏈接電子郵件,可在鏈接簽中插入“mailto:郵箱地址”
語法:
<a href ="mailto:webmaster@sohu.com">站長信箱</a>
圖像標簽
圖像的基本語法
<img src="images/adv_2.jpg" width="300" height="150" alt="明星演唱會開幕">
滾動標簽<marquee>
滾動標簽<marquee>語法:
<marquee scrolldelay ="100" dirction="up">滾動文字或圖像</marquee>
說明:
-- scrolldelay: 表示滾動樣式時間,默認為90
-- dirction:表示滾動的方向,默認從右向左
表格
創建表格,使用<table></table>
表格的使用場景:
-- 論壇 --門戶網站 --購物網站
表格的基本語法:
<table border="1">
<tr>
<td>
單元格內容
</td>
</tr>
</table>
border用來設置表格邊框尺寸大小
<td></td>定義列
<tr></tr>定義行
<table></table>定義表格
創建跨行花列的表格
舉例:
<table border="1">
<tr>
<td>手機充值、IP卡</td>
<td colsoan="2">辦公設備和文具</td>
</tr>
<tr>
<td rowspan ="2">各種卡的匯總</td>
<td>鉛筆</td>
<td>彩筆</td>
</tr>
<tr>
<td>dayin</td>
<td>kelu</td>
</tr>
</table>
注意:
colspan 合并列
rowspan 合并行
設置表格的尺寸和邊框
示例:
<table width="400" height="200" border="15"bordercolor="red">
<tr>
<td colspan="4">pinpaishangcheng</td>
</tr>
<tr>
<td colspan ="2">bijibendiannao</td>
<td colspan ="2">bangongshebei wenju haochai</td>
</tr>
<tr>
<td>hp1</td>
<td>hp2</td>
<td>hp3</td>
<td>hp4</td>
</tr>
</table>
設置表格背景
示例:
<table background="images/adv_2.jpg" width="360" height="120" border="2">
<tr>
<td colspan="6" > </td>
</tr>
<tr bgcolor="#EBEFFF">
<td colspan="3" >bijibendiannao</td>
<td colspan="3" bgcolor="yellow">bangongshebei wenju haicai</td>
</tr>
</table>
background 屬性用來設置表格的背景圖片
bgcolor屬性用來設置表格 行 列的背景色 “#EBEFFF”是
border設置邊框的厚度
cellpadding單元格填充
cellspacing單元格間距
表單的典型應用
--注冊用戶 --收集信息 --反饋信息 --為網站提供搜索工具
表單的基本語法:
表單標簽<from></from>里面最基本也是最重要的兩個屬性:action和post
示例:
<from action="http://www.baidu.com" method="post"></from>
action 指定提交后,由服務器上那個處理程序處理 action=“URL”
Method 指定向服務器提交的方法:一般為post和get方法,post方法比較安全
method="post"或"get"
表單元素
<form name="form3" mehod="post" action="">
<input type="cheakbox" name="gen" value="man"
size="21" maxlength=4 cheaked="cheaked">
</form>
type:指定元素的類型,可為text radio submin
name 控件名稱
value 控件的初始值
size 控件的初始寬度
maxlength 控件中輸入的最多字符個數
checked 控件是否被選中
表單元素屬于表單,在寫的過程中,一般將表單元素放入表單內
單行文本輸入:text
密碼框:password
下拉列表:select
提交按鈕:submit
單選按鈕:radio
復選框:checkbox
重置按鈕:reset
多行文本框:textarea
框架:
框架的基本結構:
框架頁面的基本語法:
<frameset cols="25%,50%,*" rows="50%,*" border="5">
<frame src="the_first.html">
</frameset>
cols 將窗口分隔成左中右3部分
rows將窗口分隔為上下2個部分,可選
border邊框尺寸大小
src 第一個窗口要顯示的網頁
創建多個復雜窗口
步驟:
第一步 分別創建top left right 頁面
第二步:新建多框架HTML頁面"Frame_sets.html"
示例:
<frameset rows="20%,*" frameborder="0">
<frome src="top.html" name="topframe" scrolling="no" noresize="noresize">
<frameset cols="20%,*">
<frame src="left.html" noresize="noresize" scrolling="no" name="leftframe">
<frame src="right.html" name="rightframe">
</frameset>
</frameset>
如何設置窗口鏈接的顯示位置
如果在同一個頁面中,要實現在一個框架窗口中的超鏈接頁面出現在另一個框架的窗口中 如何實現
使用target目標窗口屬性
target目標窗口屬性
--name="顯示的窗口名"
<frame src=url name="窗口名">
<a href =url target="窗口名"> target屬性指定了所連接的文件出現在名稱為"窗口名"的框架窗口中
總結:
Html文檔結構
網頁描述標簽<meta>
控制文本標簽
--<h>
--<font>
--<hr>
--<p><br>
--<ul><ol>
圖像標簽 滾動標簽
表格標簽 表格布局
表單:
--表單的提交方式 提交的處理路徑
--10個表單元素 兩個標簽
轉載于:https://www.cnblogs.com/wenkestudy/p/7132336.html
總結
- 上一篇: 并发(Concurrency)和并行(P
- 下一篇: HDU 1814 Peaceful Co