<!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. Flutter TextField设置默认值默认值和光标位置

    主要通过controller 实现,具体代码如下 TextField( //输入键盘类型 keyboardType: TextInputType.text, autofocus: true, deco ...

  2. 使用IDEA创建基于Maven SpringMvc项目

    使用IDEA创建基于Maven SpringMvc项目 1.通过程序启动——create project,或者file--New-projec打开New project 2.自定义groupid等信息 ...

  3. SQL SQL Index SEEK VS Lookup

    SEEK - find everything from index Lookup - find key from index, then visit table to find other row d ...

  4. spring boot(三)Junit 测试controller

    Junit测试Controller(MockMVC使用),传输@RequestBody数据解决办法 一.单元测试的目的 简单来说就是在我们增加或者改动一些代码以后对所有逻辑的一个检测,尤其是在我们后期 ...

  5. ORM之炀,打造自已独特的开发框架CRL

    ORM一直是长久不衰的话题,各种重复造轮子的过程一直在进行,轮子都一样是圆的,你的又有什么特点呢? CRL这个轮子造了好多年,功能也越来越标准完备,在开发过程中,解决了很多问题,先上一张脑图描述CRL ...

  6. k8s集群———flannel网络

    #master执行将内网通信地址写入etcd中,确保flannel能与etcd通信 #添加 /opt/etcd/bin/etcdctl --ca-file=/opt/etcd/ssl/ca.pem - ...

  7. socket粘包问题及解决方案

    一.粘包问题 问题1: 无法确认对方发送过来数据的大小. 'client.py' import socket client = socket.socket() client.connect( ('12 ...

  8. 1069 微博转发抽奖 (20分)C语言

    小明 PAT 考了满分,高兴之余决定发起微博转发抽奖活动,从转发的网友中按顺序每隔 N 个人就发出一个红包.请你编写程序帮助他确定中奖名单. 输入格式: 输入第一行给出三个正整数 M(≤ 1000). ...

  9. oracle中使用pl/sql进行的文件读写操作

    第一次知道,可以使用pl/sql来进行文件的读写操作,嘿嘿,简单的试了下可行. 基本步骤如下: SQL> conn sys/sys@orcl as sysdba 已连接. SQL> cre ...

  10. AssemblyScript基本使用与项目构建

    全局安装assemblyscript npm i -S AssemblyScript/assemblyscript glob 生成编译脚手架 npx asinit . 项目构建 npm run asb ...