常用Css样式

最新推荐文章于 2024-09-02 18:56:47 发布

罗白莲

最新推荐文章于 2024-09-02 18:56:47 发布

阅读量576

点赞数

文章标签： css class html url

本文链接：https://blog.csdn.net/luobailian/article/details/5638839

版权

/*标题元素*/

h1,h2,h3,h4,h5,h6 {
color: green;
}

/*父元素继承*/

body {
font-family: Verdana, sans-serif;
}

/*id 选择器*/

#red {color:red;}

/*id 选择器和派生选择器*/

#red p {
font-style: italic;
text-align: right;
margin-top: 0.5em;
}

/*类选择器*/

.center {text-align: center}

/*属性*/

/*背景*/
background-color: gray;

background-image:url(../image/topmiddle.jpg);

background-repeat:no-repeat;

/*文字*/

text-align:left;

font-size:11px;

font-family:黑体;

line-height:25px;*行间距*/

text-indent:16px;/*文字缩近*/

letter-spacing ;/*文字之间的间隔*/

word-spacing ;/*单词之间的间隔*/

/*外边距*/

margin-top:5px;
/*内边距*/

padding-bottom:30px;

/*边框*/

border-color:#e1e0e0;
border-style:solid;
border-width:0px 1px 1px 1px;

/*浮动*/

float: left;

/*绝对定位*/

#box_relative {
position: absolute;
left: 30px;
top: 20px;
}

/*相对定位*/

#box_relative {
position: relative;
left: 30px;
top: 20px;
}

简洁型css圆角矩形

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>简洁型css圆角矩形</title>
<style type="text/css">
.b1,.b2,.b3,.b4,.b1b,.b2b,.b3b,.b4b,.b{display:block;overflow:hidden;}
.b1,.b2,.b3,.b1b,.b2b,.b3b{height:1px;}
.b2,.b3,.b4,.b2b,.b3b,.b4b,.b{border-left:1px solid #999;border-right:1px solid #999;}
.b1,.b1b{margin:0 5px;background:#999;}
.b2,.b2b{margin:0 3px;border-width:2px;}
.b3,.b3b{margin:0 2px;}
.b4,.b4b{height:2px;margin:0 1px;}
.d1{background:#F7F8F9;}
</style>
</head>