TA的每日心情 | 开心
2021-3-12 23:18 |
|---|
签到天数: 2 天 [LV.1]初来乍到
|
|
元素的边框 (border) 是围绕元素内容和内边距的一条或多条线。CSS border 属性允许你规定元素边框的样式、宽度和颜色。 元素的背景是内容、内边距和边框区的背景。 样式是边框最重要的一个方面，这不是因为样式控制着边框的显示（当然，样式确实控制着边框的显示），而是因为如果没有样式，将根本没有边框。
p.aside {border-style: solid dotted dashed double;}
我们又看到了这里的值采用了 top-right-bottom-left 的顺序，您希望为元素框的某一个边设置边框样式，而不是设置所有 4 个边的边框样式，可以使用下面的单边边框样式属性：
p {border-style: solid solid solid none;}
p {border-style: solid;border-left-style: none;}
这两种方法是等价.
例1： <HTML>
<head>
<title>CSS的border范例</title>
<style type="text/css">
p {
color:blue;
font-size:22px;
letter-spacing:18px;
line-height:30px;
border-top-style:dotted;
border-top-color:red;
border-right-style:double;
border-right-color:blue;
border-bottom-style:solid;
border-bottom-color:green;
border-left-style:ridge;
border-left-color:purple;
}
</style> </head>
<body bgcolor="orange">
<center>
<h1>
<font color="lightblue">CSS边框的应用范例</font>
</h1>
<p>
昆明池水汉时功，武帝旌旗在眼中。<br>
织女机丝虚夜月，石鲸鳞甲动秋风。<br>
波飘菰米沉云黑，露冷莲房坠粉红。<br>
关塞极天惟鸟道，江湖满地一渔翁。<br>
</p>
</center>
</body>
</html>
例2：
<html>
<head>
<title>CSS的border范例</title>
<style type="text/css">
img
{
border-top-style:dotted;
border-top-color:red;
border-top-width:thick;
border-right-style:double;
border-right-color:blue;
border-right-width:medium;
border-bottom-style:solid;
border-bottom-color:pink;
border-bottom-width:15px;
border-left-style:ridge;
border-left-color:orange;
border-left-width:10px;
}
</style>
</head> <body> <center> <h1> <font color="lightgreen">CSS边框的应用范例</font> </h1>
<img src="004.jpg">
</center>
</body>
</html>
源码下载：http://file.javaxxz.com/2014/11/3/235514609.zip |
|
|手机版|Java学习者论坛
( 声明：本站资料整理自互联网，用于Java学习者交流学习使用，对资料版权不负任何法律责任，若有侵权请及时联系客服屏蔽删除 )
发表于 2014-11-3 23:55:14