<html>

    <!--

        . 给整个页面填一个一个背景

        . 给em添加一个样式样倾斜效果消失

        . 改变第一层UL的样式为蓝色，16px

        . 改变第二层的UL的样式为红色 14px

        . 改变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.嵌入式

<style type="text/css">

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.导入式

<style type="text/css">

　@import"mystyle.css";

</style>

4.链接式

<link href="mystyle.css" rel="stylesheet" type="text/css" />

CSS的选择器

1.标记选择器
2.类别选择器
3.ID选择器
4.“交集”选择器    
5.“并集”选择器      p,.p1{xxxxxx}
6.“后代”选择器      p .p1{ xxxxx }

CSS的基本操作的更多相关文章

  1. css的基本操作学习--css样式，选择器，hover，文字属性，文本属性，背景

    什么是css? 通配符选择器 <head> /* *通配符选择器 匹配任何元素 */ *{ margin: 0; padding: 0; } </head> css样式有三种 ...

  2. Matplotlib数据可视化（3）：文本与轴

      在一幅图表中,文本.坐标轴和图像的是信息传递的核心,对着三者的设置是作图这最为关心的内容,在上一篇博客中虽然列举了一些设置方法,但没有进行深入介绍,本文以围绕如何对文本和坐标轴进行设置展开(对图像 ...

  3. css属性编写顺序+mysql基本操作+html细节（个人笔记）

    css属性编写顺序: 影响文档流的属性(比如:display, position, float, clear, visibility, table-layout等) 自身盒模型的属性(比如:width ...

  4. HTML&CSS基础-ps的基本操作

    HTML&CSS基础-ps的基本操作 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任.   我们工作中可能会经常需要将一个图片做成一个网页,而图片中的字体大小,行间距,图中lo ...

  5. web前端基础知识-（二）CSS基本操作

    1. 概述 css是英文Cascading Style Sheets的缩写,称为层叠样式表,用于对页面进行美化. 存在方式有三种:元素内联.页面嵌入和外部引入,比较三种方式的优缺点. 语法:style ...

  6. python css基本操作

    1. 概述 css是英文Cascading Style Sheets的缩写,称为层叠样式表,用于对页面进行美化. 存在方式有三种:元素内联.页面嵌入和外部引入,比较三种方式的优缺点. 语法:style ...

  7. css 的一些基本操作

    日常基本使用的一些操作,持续完善中: 设置按钮圆角:border-radius:5px; 设置高度:height: 30px; 设置宽度:width: 64px; 使用span标签内容过长自动换行解决 ...

  8. [.net 面向对象程序设计深入]（6）.NET MVC 6 —— 模型、视图、控制器、路由等的基本操作

    [.net 面向对象程序设计深入](6).NET MVC 6 —— 模型.视图.控制器.路由等的基本操作 1. 使用Visual Studio 2015创建Web App (1)文件>新建> ...

  9. sqlite嵌入式数据库C语言基本操作(1)

    sqlite嵌入式数据库C语言基本操作(1) :first-child{margin-top:0!important}img.plugin{box-shadow:0 1px 3px rgba(0,0, ...

随机推荐

  1. 【jQuery UI 1.8 The User Interface Library for jQuery】.学习笔记.6.Dialog控件

    习惯上,我们播放一条简短的信息,或向浏览者询问一个问题,都会用到dialog. 创建一个基本的dialog 使用dialog 选项 形式 启用内置动画 给dialog添加按钮 使用dialog回调函数 ...

  2. Codeforces Gym 101142C：CodeCoder vs TopForces（搜索）

    http://codeforces.com/gym/101142/attachments 题意:每个人在TC和CF上分别有两个排名,如果有一个人在任意一个网站上大于另一个人的排名,那么这个人可以打败另 ...

  3. js 判断某个对象是不是dom对象

    <script type="text/javascript">//首先要对HTMLElement进行类型检查,因为即使在支持HTMLElement的浏览器中,类型却是有 ...

  4. 圆形imageview

    把java代码放到src中,把attrs文件放入valuse中,重新导包,即可照着普通的imageview一样使用. 注意:设置时使用 src 不要使用background否则图片还是方的. circ ...

  5. [ios]纯代码实现UITableViewCell的自定义扩展

    (转)参考:http://blog.sina.com.cn/s/blog_65cbfb2b0101cd60.html 第一种, 简单的增加UITableViewCell一些小功能 例如在cell上面添 ...

  6. 使用 Filter 完成一个简单的权限模型

    ****对访问进行权限控制: 有权限则可以访问, 否则提示: 没有对应的权限, 请 返回其访问者的权限可以在manager那进行设置:

  7. Android JUnit Test——批量运行测试代码

    转载请注明出自天外归云的博客园:http://www.cnblogs.com/LanTianYou/ Android测试三要素 写Android测试用例有三要素,一是我们用的“安卓模拟器device” ...

  8. HDU 4910 Problem about GCD 找规律+大素数判断+分解因子

    Problem about GCD Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others ...

  9. 自己模拟实现spring IOC原理

    1.1.IoC是什么 Ioc—Inversion of Control,即“控制反转”,不是什么技术,而是一种设计思想.在Java开发中,Ioc意味着将你设计好的对象交给容器控制,而不是传统的在你的对 ...

  10. 2016 Al-Baath University Training Camp Contest-1 J

    Description X is fighting beasts in the forest, in order to have a better chance to survive he's gon ...