CSS的基本操作

<html>
    <!--
        1. 给整个页面填一个一个背景
        2. 给em添加一个样式样倾斜效果消失
        3. 改变第一层UL的样式为蓝色，16px
        4. 改变第二层的UL的样式为红色 14px
        5. 改变body下面的ul下面的li下面的ol下面的li为#f8f8f8
    -->

    <head>
            <title>网页设计课程</title>
            <style type="text/css">
                body{background-color:#0af;}
                ul .li1{color:blue;font-size:16px;}
                ul .li1 #id1{color:red;font-size:14px;}
                ul .li1 #id1 li{color:black;}
                ul .li1 ol li{color:#f8f8f8}
                h2 em{font-style:normal}
            </style>
    </head>
    <body>
        <h2><em>网页设计课程</em></h2>
        <p>欢迎大家学习网页设计课程</p>
        <ul>
            <li class="li1">在这里，你可以学到：
                <ul>
                    <li id="id1">HTML</li>
                    <li id="id1">CSS
                        <ul>
                            <li>CSS初级</li>
                            <li>CSS中级</li>
                            <li>CSS高级</li>
                        </ul>
                    </li>
                    <li id="id1">JavaScript</li>
                </ul></li>
            <li class="li1">你还可以学习到：
                <ol>
                    <li>fireworks</li>
                    <li>flash</li>
                    <li>dreamweaver</li>
                </ol>
            </li>
        </ul>
    </body>
</html>

1.行内式

<h1 style=“color:white; background-color:blue”>这是一行文本/h1>

2.嵌入式

h1{

color:white;

LINE-HEIGHT: 90%; MARGIN-TOP: 5.76pt; TEXT-INDENT: -0.38in; unicode-bidi: embed; DIRECTION: ltr; MARGIN-BOTTOM: 0pt; MARGIN-LEFT: 0.38in; VERTICAL-ALIGN: baseline; language: zh-CN; mso-line-break-override: restrictions; punctuation-wrap: simple"> }

</style>

3.导入式

　@import"mystyle.css";

</style>

4.链接式

CSS的选择器

1.标记选择器

2.类别选择器

3.ID选择器

4.“交集”选择器

5.“并集”选择器 p,.p1{xxxxxx}

6.“后代”选择器 p .p1{ xxxxx }

posted @ 2016-03-03 15:59 岁月刀歌阅读(163) 评论(0) 收藏举报

刷新页面返回顶部

岁月刀歌

CSS的基本操作

公告