第01步：编写css样式：class_01.css

@charset "utf-8";

/* CSS Document */

div.class01{

    background-color:#9F0;

    color:#FFF

    }

第02步： 编写html界面

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>类选择器应用</title>

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

</head>

<body>

    <div class="class01">

        调用了class_01.css里面的class01样式

    </div>

</body>

</html>

CSS_03_01_CSS类选择器的更多相关文章

  1. 谈谈一些有趣的CSS题目（十）-- 结构性伪类选择器

    开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...

  2. CSS3 nth 伪类选择器

    考察下面的 HTML 代码片段: <div> <section>section 1</section> <section>section 2</s ...

  3. id选择器、类选择器、属性选择器

    在网页编辑时,通常要对样式进行各种设置.我们借助CSS样式设计中的选择器,就能很好很方便的对它们进行管理和设置了. 今天,跟大家分享一下几个常用的选择器:id选择器.类选择器.属性选择器. id选择器 ...

  4. CSS 多类选择器

    写的代码多了,就会发现,自己越来越无知了,总以为html css很简单,已经掌握的很熟练了,其实我还差的很多. 平时没有用过css的这种写法  .a.b{display:block;}   上网一查才 ...

  5. 巧用CSS3伪类选择器自定义checkbox和radio的样式

    由于原生的checkbox和radio的样式太简陋了,在设计页面的时候,设计师往往会设计自己的checkbox和radio样式.一半情况下,为了适应各个浏览器的兼容性,我们都会用其他的元素替代原生的c ...

  6. CSS3中的伪类选择器详解

      类选择器和伪类选择器区别 类选择器我们可以随意起名,而伪类选择器是CSS中已经定义好的选择器,不可以随意起名. 伪类选择器以及伪元素 我们把它放到这里 p.aaas{ text-align: le ...

  7. css伪类选择器及伪元素选择器

    1.类选择器 在css中可以使用类选择器把相同的元素定义成不同的样式.比如: 结果如下: 标题背景未变 2.伪类选择器 类选择器和伪类选择器的区别在于,类选择器我们定义的,而伪类选择器是CSS中已经定 ...

  8. CSS3 结构伪类选择器 详解

    1 CSS3 结构伪类选择器 1.E:root 匹配E元素所在的根元素 即:html 2. E:nth-child(n) (1)匹配E元素的父元素中第n个子元素,(2)且该位置的子元素类型必须是E类型 ...

  9. CSS伪类选择器

    一.CSS伪类选择器用于给某些选择器添加效果语法规则:选择器:伪选择器例:a:link {color: #FF0000} 未访问的链接 a:visited {color: #00FF00} 已访问的链 ...

随机推荐

  1. .NET对象与Windows句柄（三）：句柄泄露实例分析

    在上篇文章.NET对象与Windows句柄(二):句柄分类和.NET句柄泄露的例子中,我们有一个句柄泄露的例子.例子中多次创建和Dispose了DataReceiver和DataAnalyzer对象, ...

  2. JNI字段描述符（转）

    转载自http://fgsink.blog.163.com/blog/static/16716997020124310169911/ “([Ljava/lang/String;)V” 它是一种对函数返 ...

  3. 【转】Android绘制View的过程研究——计算View的大小

    Android绘制View的过程研究——计算View的大小 转自:http://liujianqiao398.blog.163.com/blog/static/18182725720121023218 ...

  4. 非常详细的docker学习笔记

    http://www.open-open.com/lib/view/open1423703640748.html 一.Docker 简介 Docker 两个主要部件: Docker: 开源的容器虚拟化 ...

  5. CSS布局一

    CSS布局一 实例一(居中) div#container{ width:960px; height:650px; margin:0 auto; border:1px solid #ccc; /*就是说 ...

  6. JavaScript：基础表单验证

    在用户填写表单的过程之中,往往需要编写一堆的验证操作,这样就可以保证提交的数据时正确的.那么下面就模拟表单验证的处理操作完成. 如果要想进行验证,首先针对于输入的数据来进行一个验证处理. 1.定义一个 ...

  7. Web页面上的控件

    Web页面,即:.aspx文件页面的根目录下,分为了5部分 [0]-{System.Web.UI.LiteralControl} [1]-{System.Web.UI.HtmlControls.Htm ...

  8. 官方教程：教你用好微信JS-SDK接口

    微信开放JS-SDK接口,开发者和行业用户可谓是欢欣鼓舞.奔走相告,目测将激起一大波第三方开发商的创新产品!真真是H5开发者的利好!但也有用户表示,还不了解JS-SDK接口到底是啥,究竟怎么用.现在, ...

  9. App开发需要了解的基本技术

    本文针对小白用户对App做一个简单的介绍,首先要了解App都有哪些类型,不同的类型适用于哪些需求,用户可以根据自己的需求选择不同的App开发. 一 App有哪些形式 WebApp:简单来说,Web A ...

  10. Spring MVC框架下在java代码中访问applicationContext.xml文件中配置的文件（可以用于读取配置文件内容）

    <bean id="propertyConfigurer" class="com.****.framework.core.SpringPropertiesUtil& ...