CSS在html中的使用
在web开发中，HTML、JavaScript、css、php可以说是缺一不可，这节我们就来讲讲HTML与CSS之间的简单应用
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="myCss.css" />
<title>CSS的使用</title>
</head>
<body>
<h1 class="title">标题</h1>
<table class="table1">
<!-- 设置表头 -->
<tr>
<th>第一列</th>
<th>第二列</th>
<th>第三列</th>
</tr>
<tr>
<td>row 1, column 1</td>
<td>row 1, column 2</td>
<td>row 1, column 3</td>
</tr>
<tr>
<td>row 2, column 1</td>
<td>row 2, column 2</td>
<td>row 2, column 3</td>
</tr>
</table>
</body>
</html>
CSS文件如下：
@charset "utf-8";
/* CSS Document */
.title{
font-family: 微软雅黑;
font-size: 26px;
font-weight: bold;
border-bottom:1px dashed #CCCCCC;
color: #255e95;
}
.table1 {
margin-top: 13px;
}
.table1 td{
background-color:#ff0000;
height:25px;
line-height:150%;
}
结果如下：
敲黑板：
1、如何引用css：在html文件中进行link，如第一个文件所示的 <link rel=“stylesheet” type=“text/css” href=“myCss.css” />
2、如何将css与html里的对象关联上： 在html设置class，如 <h1 class=“title”>，并在css中写好对应的类对应的style，如 .title{}，其中 . 表示当前页面对象，title表示类名
3、如何在css中设置对象的子对象：我们在设置表格的时候，td是table的子对象，我们只需要在css中如上设置 .table1 td{} 即可