<!DOCTYPE html>

 <html>

     <head>

         <meta charset="UTF-8">

         <title>css使用方法</title>

         <!---->

         <style type = "text/css">

              /*css代码*/

             /*id选择器*/

              #box{

                  /*color表示设置颜色*/

                  color:blue;

              }

              /*类选择器*/

             .box3{

                 color: cornflowerblue;

             }

             #p1{

                 color: red;

             }

             /*标签选择器*/

             p{

                 color: blueviolet;

             }

         </style>

         <!--这种方式的好处：让html代码和css代码分离，方便维护-->

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

     </head>

     <body>

         <!--通过自定义名字产生关联-->

         <div  id = "box">这是一个盒子</div>

         <div  id = "box2">这是一个盒子</div>

         <div  style = "color:green;" >这是一个盒子</div>

         <div class = "box3">这是一个box</div>

         <!--需求：把p标签的字体都设置为红色-->

         <p id="p1">这是p1</p>

         <div id="p1">这是p2</div>

         <p id="p1">这是p3</p>

         <p id="p1">这是p4</p>

         <!--需求：把p标签的字体都设置为红色-->

         <p >这是p1</p>

         <p >这是p2</p>

         <p >这是p3</p>

         <p >这是p4</p>

     </body>

 </html>

CSS-02-css的三种基础选择器的更多相关文章

  1. css样式表中四种属性选择器

    学习此连接的总结http://developer.51cto.com/art/201009/226158.htmcss样式表中四种属性选择器1> 简易属性 tag[class]{ font-we ...

  2. java：HTML（table表格，ul列表）和CSS（导入.css文件，三种定义颜色方式，三种样式选择器，a标签属性顺序，）

    1.重点掌握: html: 1.form表单:input,checkbox,seelct,radio,button,submit 2.table表格:thead-->tr-->th;tbo ...

  3. CSS选 择器 三种样式

    一.CSS三种样式 代码 宽度 高度 实线 颜色  A内联样式是优先级最高的方式 px必须写 A:内联式  弊端:代码多很乱 <body> <div class="divc ...

  4. CSS控制样式的三种方式优先级对比验证

    入职已经一个月了,自此后,就好久没有写过博客了,在此先跟关注我的博友们说声抱歉.今天,在公司的一个培训作业的驱动以及伟哥那句“再不写博客就开除你”的监督下,我终于重拾旧爱,再次登录博客园,继续与大家分 ...

  5. js或css文件合并的三种方式推荐

    源文档 <http://www.jb51.net/article/32834.htm> 在Web项目的开发中,js,css文件会随着项目的开发变得越来越多,越来越大,这就给给性能方面带来一 ...

  6. css引入页面的三种方法

    1.内联式:直接在标签上写样式 <!DOCTYPE html> <html lang="en"> <head> <meta charset ...

  7. CSS：概念和三种样式

    简介: CSS(Cascading Style Sheets):层叠样式表,它用来控制HTML标签的样式,给网页结构穿衣服~ CSS的编写格式是键值对的形式  ->  格式:属性名 : 属性值: ...

  8. 纯Css绘制三角形箭头三种方法

    在制作网页的过程中少不了绘制类似图片的三角形箭头效果,虽然工程量不大,但是确实麻烦.在学习的过程中,总结了以下三种方法,以及相关的例子. 一.三种绘制三角形箭头方法 1.方法一:利用overflow: ...

  9. [HTML/CSS]创建新元素的三种方法

    第一种:通过text/HTML var txt1="<h1>Text.</h1>"; 第二种:通过jQuery var txt2=$("<h ...

随机推荐

  1. ES6类的继承

    ES6 引入了关键字class来定义一个类,constructor是构造方法,this代表实例对象. constructor相当于python的init 而this 则相当于self 类之间通过ext ...

  2. Java 学习笔记(8)——匿名对象与内部类

    一般在编写代码时可能会遇到这样的场景--在某些时候,我需要定义并某个类,但是只会使用这一次,或者是某个类对象只会使用一次,为它们专门取名可能会显的很麻烦.为了应对这种情况,Java中允许使用匿名对象和 ...

  3. ffmpeg 转码并截图的命令分析

    一.转码并截图的命令分析: 1.转码并截图,将码率转换为900Kffmpeg -i E:\\1.MOV -i E:\\123.jpg -filter_complex overlay=W-w  -b:v ...

  4. C++Review1_多态和虚函数

    继承是实现多态的基础.虚函数是实现多态的方法.虚函数.多态.继承都是紧密相关的概念.而继承是所有概念的基础: 多态:简单来讲就是接口一样,实现多样.多态是指通过基类的指针或者引用,在运行时动态调用实际 ...

  5. PyCharm永久破解方法

    1,下载破解补丁: https://pan.baidu.com/s/1LcXvupL00XTU-HHE1J6ynA 提取码: 8t1w 下载补丁文件 jetbrains-agent.jar 并将它放置 ...

  6. PHP四大主流框架的优缺点总结

    本篇文章我们来讲讲PHP四大框架的优缺点都有哪些,让你们在开发中更好的去选择使用哪款PHP框架去完成项目,废话不多说,我们一起来看看吧!! ThinkPHP ThinkPHP(FCS)是一个轻量级的中 ...

  7. JDK源码系列(一) ------ 深入理解SPI机制

    什么是SPI机制 最近我建了另一个文章分类,用于扩展JDK中一些重要但不常用的功能. SPI,全名Service Provider Interface,是一种服务发现机制.它可以看成是一种针对接口实现 ...

  8. hdu3499---玄学的分层图

    枚举固然可以,但是我还是想看看分层图.... 如本题所述 ,从上图到下图就是一个折扣的过程,上部分只有一种办法下去,下部分图没有办法去上面,该模型十分的巧妙啊!!! 下面我来演示一下自己改的样例吧 紫 ...

  9. Dubbo的核心组件、架构设计与Dubbo面试考点

    1.Dubbo是什么? Dubbo 是一个分布式.高性能.透明化的 RPC 服务框架,提供服务自动注册.自动发现等高效服务治理方案, 可以和 Spring 框架无缝集成. RPC 指的是远程调用协议, ...

  10. Spring in action读书笔记（一） 自动化装配bean

    需要引入的ja包 <dependency> <groupId>org.springframework</groupId> <artifactId>spr ...