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
- 下一篇： Python 前端的第三方库