css一般样式

1.宽高

100px; 宽
height:100px; 高

2.背景

background-color: #fff; 背景色

background-image: url(./img.jpg); 背景图(默认平铺)

background-repeat: repeat-x/no-repeat; 背景图平铺

backgroung: #fff url(img.jpg) no-repeat; 颜色背景图平铺

background-size: auto/cover; 背景图尺寸

background-attachment: scroll/fixed; 随滚动条动固定(背景窗口内)

background-position: bottom right/10px 10px; 背景图定位上下左右

<head>
<style>
    div{
        width:350px;
        height:260px;
        background:#888 url(./image/VNlogo.jpg) no-repeat;
        background-attachment:fixed;
        background-position: 50px 50px;
    }
</style>
</head>

<body>
    <div></div>
</body>

3.文本

color:red; 文本颜色

text-align:left/center/right; 水平对齐

font-size:12px; 字体大小通用

line-height:50px; 行高 50px 垂直居中

font-family:'微软雅黑' 字体通用

font:14px/20px '微软雅黑' 字体大小行高字体

text-decoration:underline/overline/linethrough/none; 划线

font-weight:normal/bold; 加粗

font-style:normal/italic; 倾斜

text-indent:40px; 缩进(标签内部继承)

text-transform:uppercase/lowercase/capitalize; 大写小写首字母大写

text-shadow:10px 10px 10px red; 水平垂直模糊颜色文字阴影

letter-spacing:-1px；字符间距

<head>
<meta charset="utf-8">
<style>
    div{
        color:red;
        text-align:center;
        font:20px/50px '微软雅黑';}
</style>
</head>

<body>
    <div>哈哈哈哈哈哈哈哈哈哈<br>嘿嘿嘿嘿嘿嘿嘿嘿嘿嘿</div>
</body>

4.列表

list-style-type:circle/square/none; 无序列表标记

list-style-type:upper-roman/lower-alpha; 有序列表大写罗马小写英文

list-style-image:url('./a.jpg'); 列表标记图

list-style:square url("sqpurple.gif"); 形状图片

<head>
<meta charset="utf-8">
<style>
    div li{
        list-style-type:square;
    }
</style>
</head>

<body>
    <div>
        <ul>
            <li>哈哈</li>
            <li>嘿嘿</li>
            <li>呼呼</li>
            <li>呵呵</li>
        </ul>
    </div>
</body>