-
网页元素HTML
-
列表
-
(1)无序列表
<ul>
<li>****</li>
<li>***</li>
</ul>
更多样式：<ul type="circle|square">
(2)有序列表
<ol start="100">
<li>****</li>
<li>***</li>
</ol>
更多样式：<ol type="A|a|i|I">
-
-
表单元素
-
(1)文本框
<input type="text" maxlength="20" placeholder="请输入用户名...">
(2)密码框
<input type="password" maxlength="16" >
(3)单选按钮
<input type="radio" name="sex" checked>男</input>
<input type="radio" name="sex">女</input>
(4)下拉列表
<select>
<option>请选择--</option>
<option>北京</option>
<option>广东</option>
</select>
(5)复选框
<input type="checkbox" name="jiuye">游戏测试</input>
<input type="checkbox" name="jiuye">银行测试</input>
(6)多行文本框
<textarea rows="8" cols="30">
包括教育背景、工作经验、性格特征等
</textarea>
(7)上传文件
<input type="file">
(8)按钮
<button>确定提交</button>
<input type="submit" value="注册">
<input type="reset" value="重置">
-
二、CSS美化网页
1、CSS选择器
(1)Html标签选择器：当前网页中同一种标签会设置成指定的样式
(2)class标签选择器：当前网页中相同的class处会设置成指定的样式
(3)id标签选择器：当前网页中某一处需要设置成唯一的样式
2、CSS样式的应用方法
(1)行内：位于<body>中的某个标签内，只对该标签生效。
(2)内嵌：位于<head></head>,针对该html文件生效
(3)外部样式：将样式代码单独存在css文件中，在html文件的head中使用link链接法将css文件与网页文件进行绑定
<link rel="stylesheet" type="text/css" href="gushi.css">
-
三、框架
1、上下结构：
<html> <head></head> <frameset rows="20%,*" bordercolor="#0000FF" border="5"> <frame name="top" src=“1.html"> <frame name="bottom" src=“2.html"> </frameset> </html>
2、左右结构
<html> <head></head> <frameset cols="20%,*" bordercolor="#0000FF" border="5"> <frame name="left" src=“1.html"> <frame name="right" src=“2.html"> </frameset> </html>
3、上中下结构
<html> <head></head> <frameset rows="20%,*,10%" bordercolor="#0000FF" border="5"> <frame name="top" src=“1.html"> <frame name="middle" src=“2.html"> <frame name="bottom" src=“3.html"> </frameset> </html>
4、上下结构，下面又分成左中右两部分
<html> <head></head> <frameset rows="20%,*" bordercolor="#0000FF" border="5"> <frame name="top" src=“1.html"> <frameset cols="20%,*,10%" bordercolor="#0000FF" border="5"> <frame name="left" src=“1.html"> <frame name="right" src=“1.html"> <frame name="right" src=“1.html"> </frameset> </frameset> </html>
5、上中下结构，中间拆分成左中右三部分
<html> <head></head> <frameset rows="10%,*,10%" bordercolor="#0000FF" border="5"> <frame name="top" src=“1.html"> <frameset cols="20%,*,10%" bordercolor="#0000FF" border="5"> <frame name="left" src=“1.html"> <frame name="middle" src=“1.html"> <frame name="right" src=“1.html"> </frameset> <frame name="bottom" src=“1.html"> </frameset> </html>