阅读题:
表格标签
- 表格基本的三个要素:表格标题、项目表头、数据资料
- table 定义一个表格
caption 定义表格标题
tr 定义表格中的一行
th 定义表格中的表头单元格,嵌套在tr中
td 定义表格中的数据单元格,嵌套在tr中 - 表格边框的属性:
frame:设置表格边框样式
rules:设置表格内部边框样式
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/ab2202c6772520526364caae226b8e6b.png)
- 单元格的合并
colspan:水平单元格合并
rowspan:垂直单元格合并
分组元素
<ul>
元素
ul 元素表示不排序的项目列表 <ul> <li></li> </ul>
属性 type
设置列表符号样式,可以取disk
、circle
、square
<ol>
元素
有序的列表项目
css样式
- 背景样式
background-attachment:设置背景图像是否随页面一起滚动,取值scroll(滚动)、fixed(固定)
background-origin:规定background-position属性相对于什么位置来定位
background-clip:background-clip - 网页中字体样式属性
font-variant:设定小型大写字母(normal:正常;small-caps:小型大写字母)
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/a8fefab8157d0f169fc23e315ff0b745.png)
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/193a871a2c722df5ce5ebe35856798ca.png)
- 网页中文本样式属性
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/e75870782dae94217eb06b346e18dbc4.png)
css导入
导入css的四种方法
大题:
<html>
<head>
<title>日期对象</title>
</head>
<script>
var date1 = new Date();
var year = date1.getFullYear();
var date2 = new Date();
date2.setFullYear(2020, 10, 25);
date2.setDate(date2.getDate() + 2);
var now = new Date();
var nationalDay = new Date(2019, 0, 1, 0, 0, 0);
var msel = nationalDay - now;
document.write("距离2019年元旦还有:", + msel + "毫秒<br>");
document.write("距离2019年元旦还有:", + parseInt(msel / 1000) + "秒<br>");
document.write("距离2019年元旦还有:", + parseInt(msel / (60 * 1000)) + "分钟<br>");
document.write("距离2019年元旦还有:", + parseInt(msel / (60 * 60 * 1000)) + "小时<br>");
document.write("距离2019年元旦还有:", + parseInt(msel / (60 * 60 * 24 * 1000)) + "天<br>");
var timeResult = 0;
var timer;
function timedCount() {
document.txtForm.txt.value = timeResult;
timeResult = timeResult + 1;
timer = setTimeout("timedCount()", 1000);
}
function stopCount() {
clearTimeout(timer);
}
</script>
<body>
<form id="txtForm" name="txtForm" method="get">
<input type="button" value="开始!" onclick="timedCount()">
<input type="text" name="txt" id="txt">
<input type="button" value="停止!" onclick="stopCount()">
</form>
</body>
</html>
<html>
<head>
<title>XX表</title>
</head>
<body>
<form action="url" method="get/post" name="表单名称">
<fieldset>
<legend>信息表</legend>
姓名:<input type="text"><br />
密码:<input type="password"><br />
学历:
<select name="XXX" size="1" multiple>
<option value="本科">本科</option>
<option value="大专">大专</option>
<option value="研究生" selected>研究生</option>
<option value="博士">博士</option>
</select><br />
性别:
<input type="radio" value="男">男
<input type="radio" value="女" checked>女<br />
爱好:
<input type="checkbox" value="吃饭"> 吃饭
<input type="checkbox" value="睡觉" checked> 睡觉
<input type="checkbox" value="打豆豆"> 打豆豆<br />
按钮:
<input type="button" value="⭐"><br />
隐藏:
<input type="hidden"><br />
滑动条:
<input type="range"><br />
搜索框:
<input type="search"><br />
url地址输入框:
<input type="url"><br />
邮箱:
<input type="text" pattern="^([0-9][6])$">
<span style="color: red">请输入格式为XXX的邮箱</span>
</fieldset>
<input type="submit">
<input type="reset">
</form>
</body>
</html>