具体参见css20.chm帮助文档
1.内嵌css
<html>
<head>
<title>背景设置</title>
<style type="text/css">
/*body{
background-image:url(images/a.jpg);
background-repeat:repeat-y;
}*/
body{
background:url(images/a.jpg) no-repeat;
}
</style>
</head>
<body>
内嵌css
</body>
</html>
2. 外部应用css
<html>
<head>
<title>背景设置</title>
<link rel="stylesheet" style="text/css" href="style/style.css"/>
</head>
<body>
外部应用css
</body>
</html>
- style.css
body{
background: blue;
}
3.css边框
<html>
<head>
<title>边框</title>
<style type="text/css">
table{
border:1px solid black;
border-collapse:collapse;
}
td{
border:1px solid black;
border-collapse:collapse;
}
</style>
</head>
<body>
<table border="1">
<tr>
<td>用户代码</td>
<td>用户代码</td>
</tr>
<tr>
<td>001</td>
<td>张三</td>
</tr>
<tr>
<td>002</td>
<td>李四</td>
</tr>
</table>
</body>
</html>
4.css字体
<html>
<head>
<title>背景设置</title>
<style type="text/css">
</style>
</head>
<body>
<table border="1">
<tr>
<td>用户代码</td>
<td>用户代码</td>
</tr>
<tr>
<td>001</td>
<td>张三</td>
</tr>
<tr>
<td>002</td>
<td>李四</td>
</tr>
</table>
</body>
</html>
5.css链接
<html>
<head>
<title>背景设置</title>
<style type="text/css">
/*
去除下划线
link:将从未访问过的链接设置为红色
visited:已经访问过的链接设置为绿色
active:将得到焦点的链接设置为黄色
hover:鼠标悬停在链接上设置为蓝色S
*/
a{
text-decoration:none;
}
a:link{
color:red;
}
a:visited{
color:green;
}
a:active{
color:yellow;
}
a:hover{
color:blue;
font-size:40px;
word-spacing:20px;
}
</style>
</head>
<body>
<a href="3">HelloWorld</a>
</body>
</html>
6.cssID选择器
<html>
<head>
<title>背景设置</title>
<style type="text/css">
table{
border:1px solid black;
border-collapse:collapse;
}
td{
border:1px solid black;
border-collapse:collapse;
}
#IDselect{
text-align:center;
font-family : 黑体;
}
</style>
</head>
<body>
<table border="1" width="50%">
<tr id="IDselect">
<td>用户代码</td>
<td>用户代码</td>
</tr>
<tr>
<td>001</td>
<td>张三</td>
</tr>
<tr>
<td>002</td>
<td>李四</td>
</tr>
</table>
</body>
</html>
7.css类选择器
<html>
<head>
<title>背景设置</title>
<style type="text/css">
table{
border:1px solid black;
border-collapse:collapse;
}
td{
border:1px solid black;
border-collapse:collapse;
}
.CLASSselect{
text-align:center;
font-family : 仿宋_GB2312;
}
</style>
</head>
<body>
<table border="1" width="50%">
<tr class="CLASSselect">
<td>用户代码</td>
<td>用户名称</td>
</tr>
<tr>
<td>001</td>
<td>张三</td>
</tr>
<tr>
<td>002</td>
<td>李四</td>
</tr>
</table>
</body>
</html>
扫一扫
5765
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
