css与html的一些最简单的用法

p.big {
    line-height: 200%
}
p.uppercase {
    text-transform: uppercase
}

p.lowercase {
    text-transform: lowercase
}

p.capitalize {
    text-transform: capitalize
}

p.serif {
    font-family: "Times New Roman", Georgia, Serif
}

p.sansserif {
    font-family: Arial, Verdana, Sans-serif
}

ul.disc {
    list-style-type: disc
}

ul.circle {
    list-style-type: circle
}

ul.square {
    list-style-type: square
}

ul.none {
    list-style-type: none
}

ol.decimal {
    list-style-type: decimal
}

ol.lroman {
    list-style-type: lower-roman
}

ol.uroman {
    list-style-type: upper-roman
}

ol.lalpha {
    list-style-type: lower-alpha
}

ol.ualpha {
    list-style-type: upper-alpha
}
div {
    background-color: #00FFFF;
    width: 450px;
    height: 250px;
    overflow: auto
}

配置信息常用写法:链接用a来表示   则配置信息应该设为 a.xx{}    对于段落来说,他用p表示则用   p.xx{},   对于无序列表用 ul.xx{}, 对于有序列表用 ol.xx{}
申明CSS内容的写法如下<style type="text/css">   CSS内容    <style>

在html文件<body>中则采取如下的写法:

<ul class="disc">
        <li>咖啡</li>
        <li>茶</li>
        <li>可口可乐</li>
    </ul>

    <ul class="circle">
        <li>咖啡</li>
        <li>茶</li>
        <li>可口可乐</li>
    </ul>

    <ul class="square">
        <li>咖啡</li>
        <li>茶</li>
        <li>可口可乐</li>
    </ul>

    <ul class="none">
        <li>咖啡</li>
        <li>茶</li>
        <li>可口可乐</li>
    </ul>
    <ol class="decimal">
        <li>咖啡</li>
        <li>茶</li>
        <li>可口可乐</li>
    </ol>

    <ol class="lroman">
        <li>咖啡</li>
        <li>茶</li>
        <li>可口可乐</li>
    </ol>

    <ol class="uroman">
        <li>咖啡</li>
        <li>茶</li>
        <li>可口可乐</li>
    </ol>

    <ol class="lalpha">
        <li>咖啡</li>
        <li>茶</li>
        <li>可口可乐</li>
    </ol>

    <ol class="ualpha">
        <li>咖啡</li>
        <li>茶</li>
        <li>可口可乐</li>
    </ol>
    <ul>
        <li>咖啡</li>
        <li>茶</li>
        <li>可口可乐</li>
    </ul>


 

posted @ 2013-08-28 11:28  最是那一杯红酒  阅读(157)  评论(0编辑  收藏  举报