静态网页设计html css 表格
时间: 2024-11-15 14:15:17 浏览: 0
大一期末毕业答辩 漫威静态网页设计 HTML+CSS
5星 · 资源好评率100%
静态网页设计通常涉及HTML (HyperText Markup Language) 和 CSS (Cascading Style Sheets) 的组合。HTML 是用于创建网页结构的语言,它定义了文本、图像、链接和其他内容的基本布局。表格在 HTML 中是通过 `<table>` 标签创建的,它由 `<tr>`(行)、`<td>`(数据单元格)或 `<th>`(表头单元格)组成。
CSS 可以用来美化和控制表格的外观,如设置边框样式、颜色、宽度,调整单元格间距,以及定义行高、列宽等。你可以使用 `border` 属性给表格添加边框,`width` 和 `height` 设置单元格尺寸,`text-align` 控制文字对齐,`background-color` 改变背景色等。
下面是一个简单的HTML表格示例:
```html
<!DOCTYPE html>
<html>
<head>
<style>
table {
border-collapse: collapse; /* 合并边框 */
width: 100%;
}
th, td {
border: 1px solid black;
padding: 8px;
text-align: left;
}
th {
background-color: #f2f2f2;
}
</style>
</head>
<body>
<table>
<tr>
<th>姓名</th>
<th>年龄</th>
<th>城市</th>
</tr>
<tr>
<td>张三</td>
<td>30</td>
<td>北京</td>
</tr>
<tr>
<td>李四</td>
<td>25</td>
<td>上海</td>
</tr>
</table>
</body>
</html>
```
在这个例子中,CSS定义了表格的基本样式,而HTML则提供了实际的数据结构。
阅读全文