<!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. Channel 9视频整理【2】

    JadeChang https://channel9.msdn.com/Niners/JadeChang 繁体中文视频 2016 Nano Server / Docker / Containers 打 ...

  2. JVM 体系结构与工作方式

    .katex { display: block; text-align: center; white-space: nowrap; } .katex-display > .katex > ...

  3. $Noip2010/Luogu1525$ 关押罪犯 贪心

    $Luogu$ $Sol$ 贪心.尽量把怨气值大的罪犯放到两个监狱,所以首先要按照怨气值从大到小排序.当扫描到两个罪犯已经被指定到同一个监狱时,就结束循环,这个怨气值就是答案.当然把怨气值大的两个罪犯 ...

  4. StrategyPattern(策略模式)-----Java/.Net

    在策略模式(Strategy Pattern)中,一个类的行为或其算法可以在运行时更改.这种类型的设计模式属于行为型模式. 在策略模式中,我们创建表示各种策略的对象和一个行为随着策略对象改变而改变的 ...

  5. 「USACO08JAN」电话线Telephone Lines 解题报告

    题面 大意:在加权无向图上求出一条从 \(1\) 号结点到 \(N\) 号结点的路径,使路径上第 \(K + 1\) 大的边权尽量小. 思路: 由于我们只能直接求最短路,不能记录过程中的具体的边--那 ...

  6. Win10删除桌面上的回收站、计算机、网络等图标

    解决方案: 桌面上鼠标右键,选择个性化 个性化窗口左边侧栏选择主题 移动至最下方点击"桌面图标设置"即可看到系统中的五个桌面图标

  7. React框架随笔

    React框架随笔 现在最热门的前端框架有AngularJS.React.Bootstrap等.自从接触了ReactJS,ReactJs的虚拟DOM(Virtual DOM)和组件化的开发深深的吸引了 ...

  8. Linux环境下详细讲解部署MySQL5.7版本

    说明: 在本人写作这篇安装MySQL文章时,虽然MySQL已经发布到8.0.17版本,但对于行业来说,主力版本依然是5.7版本.目前在Linux环境默认安装时,大部分已经默认安装到8版本了,所以本人特 ...

  9. 2019年最值得关注的AI领域技术突破及未来展望

    选自venturebeat 翻译:魔王.一鸣 前言 AI 领域最杰出的头脑如何总结 2019 年技术进展,又如何预测 2020 年发展趋势呢?本文介绍了 Soumith Chintala.Celest ...

  10. Scala与Mongodb实践2-----图片、日期的存储读取

    目的:在IDEA中实现图片.日期等相关的类型在mongodb存储读取 主要是Scala和mongodb里面的类型的转换.Scala里面的数据编码类型和mongodb里面的存储的数据类型各个不同.存在类 ...