index.html
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8"> <title>CSS表格与列表</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <table border="1"> <caption>人员档案</caption> <tr> <th>姓名</th> <th>性别</th> <th>年龄</th> </tr> <tr> <td>张三</td> <td class="sex">男</td> <td></td> </tr> <tr> <td>李四</td> <td>女</td> <td>28</td> </tr> <tr> <td>王五</td> <td>男</td> <td>32</td> </tr> </table> <ul> <li>张三，是一个非常好的青年</li> <li>李四</li> <li>王五<b>2</b></li> <li>马六</li> </ul> <div><span>我是HTML5</span></div> <em>内容简介：</em><textarea rows="10"></textarea> </body> </html>
style.css
@charset "utf-8";
table {
width: 400px;
height: 300px;
text-align: center;
/*border-collapse: separate;*/
/*border-collapse: collapse;*/
/*border-spacing: 10px;*/
/*caption-side: bottom;*/
/*empty-cells: hide;*/
/*table-layout: fixed;*/
border: 1px solid red;
}
table tr th, table tr td {
border: 1px solid red;
}
ul {
width: 120px;
/* list-style-type: square;
list-style-position: inside;
list-style-image: url(bullet.png);*/
list-style: square inside url(bullet.png);
}
.sex {
/*vertical-align: bottom;*/
/*vertical-align: baseline;*/
/*vertical-align: middle;*/
}
b {
/*vertical-align: sub;*/
vertical-align: super;
}
div {
width: 300px;
height: 300px;
background: silver;
text-align: center;
}
div span {
background: green;
/*vertical-align: -50px;*/
/*vertical-align: -200%;*/
}
em {
vertical-align: 80px;
}
相关推荐
在CSS中，对表格和列表的样式进行设置能够让HTML页面上的表格和列表呈现出更加丰富和个性化的显示效果。本章将主要介绍如何利用CSS为HTML表格和列表设置样式，并且会涉及到一些其他的相关功能。 首先来看表格样式的...
HTML & CSS设计与构建网站 完整中文版带目录.pdf 个人收集电子书，仅用学习使用，不可用于商业用途，如有版权问题，请联系删除！ 前言 v 第1章 结构 1 ...第18章建站过程和设计方法 441 第19章实用信息 465
第6章 用css设置表格与表单的样式 第7章 用css设置页面和浏览器的元素 第8章 用css制作实用的菜单 第9章 css滤镜的应用 第2部分 css+div美化和布局篇 第10章 理解css定位与div布局 第11章 css+div布局方法剖析 第12...
第6章 用CSS设置表格与表单的样式 6.1 控制表格 6.2 表格实例一：隔行变色 6.3 表格实例二：鼠标经过时变色的表格 6.4 表格实例三：日历 6.5 CSS与表单 6.6 综合实例一：直接输入...
第6章 用CSS设置表格与表单的样式 6.1 控制表格 6.2 表格实例一：隔行变色 6.3 表格实例二：鼠标经过时变色的表格 6.4 表格实例三：日历 6.5 CSS与表单 6.6 综合实例一：...
第6章 用CSS设置表格与表单的样式 6.1 控制表格 6.2 表格实例一：隔行变色 6.3 表格实例二：鼠标经过时变色的表格 6.4 表格实例三：日历 6.5 CSS与表单 6.6 综合实例一：直接输入...
李刚 疯狂HTML5CSS3JavaScript讲义的源代码 第一部分 第1章 HTML 5简介 第2章 HTML 5的常用元素与属性 第3章 HTML 5表单相关元素和属性 ... 第18章 客户端通信 第四部分 第19章 HTML 5的疯狂俄罗斯方块
第6章 用CSS设置表格与表单的样式 6.1 控制表格 6.2 表格实例一：隔行变色 6.3 表格实例二：鼠标经过时变色的表格 6.4 表格实例三：日历 6.5 CSS与表单 6.6 综合实例一：直接输入...
第6章 用CSS设置表格与表单的样式 6.1 控制表格 6.2 表格实例一：隔行变色 6.3 表格实例二：鼠标经过时变色的表格 6.4 表格实例三：日历 6.5 CSS与表单 6.6 综合实例一：直接输入...
《精通HTML5 + CSS3+JavaScript网页设计》内容主要包括CSS3的基本语法和概念，设置文字、段落、图片、背景、表格、表单和...第18章 HTML5绘制图形 第19章 HTML5中的音频和视频 第20章 地理定位、离线Wed应用和Web存储
全书pdf 210M, 共分9个分卷, 这是第8分卷 中文名: 精通CSS与HTML设计模式 英文名: Pro CSS and HTML Design Patterns 资源格式: PDF ...第18章 字母下沉 第19章 强调框和引用 第20章 提示框 索引...
第18章（源代码\第18章） 示例描述：本章演示背景属性用法。 背景的基本语法.html 属性背景的基本语法。 设置背景图像.html 设置背景图像。 设置背景图像滚动.html 设置背景图像滚动。 设置背景图像...
第1章 HTML5概述 ... ... 1.1.2 THML 5文件的基本结构 ... ...1.3.1 各大浏览器与HTML5的兼容 ...第2章 HTML5网页文档结构 ...第18章 HTML5绘制图形 第19章 HTML5中的音频和视频 第20章 地理定位、离线Wed应用和Web存储
第18章 Web Worker多线程API 588 18.1 使用Worker创建多线程 589 18.2 与Worker线程进行数据交换 591 18.3 Worker线程嵌套 594 18.4 使用SharedWorker创建共享线程 597 18.5 Promise 603 18.6 本章小结 611 ...
全书pdf 210M, 共分9个分卷, 这是第7分卷 中文名: 精通CSS与HTML设计模式 英文名: Pro CSS and HTML Design Patterns 资源格式: PDF ...第18章 字母下沉 第19章 强调框和引用 第20章 提示框 索引..
全书pdf 210M, 共分9个分卷, 这是最后一个分卷, 第9分卷 中文名: 精通CSS与HTML设计模式 英文名: Pro CSS and HTML Design Patterns ...第18章 字母下沉 第19章 强调框和引用 第20章 提示框 索引..
全书pdf 210M, 共分9个分卷, 这是第3分卷 中文名: 精通CSS与HTML设计模式 英文名: Pro CSS and HTML Design Patterns 资源格式: PDF 版本: 中文版高清扫描...第18章 字母下沉 第19章 强调框和引用 第20章 提示框 索引
全书pdf 210M, 共分9个分卷, 这是第4分卷 中文名: 精通CSS与HTML设计模式 英文名: Pro CSS and HTML Design Patterns 资源格式: PDF ...第18章 字母下沉 第19章 强调框和引用 第20章 提示框 索引....