CSS-02-css的三种基础选择器
<!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的三种基础选择器的更多相关文章
- css样式表中四种属性选择器
学习此连接的总结http://developer.51cto.com/art/201009/226158.htmcss样式表中四种属性选择器1> 简易属性 tag[class]{ font-we ...
- java：HTML（table表格，ul列表）和CSS（导入.css文件，三种定义颜色方式，三种样式选择器，a标签属性顺序，）
1.重点掌握: html: 1.form表单:input,checkbox,seelct,radio,button,submit 2.table表格:thead-->tr-->th;tbo ...
- CSS选 择器 三种样式
一.CSS三种样式 代码 宽度 高度 实线 颜色 A内联样式是优先级最高的方式 px必须写 A:内联式 弊端:代码多很乱 <body> <div class="divc ...
- CSS控制样式的三种方式优先级对比验证
入职已经一个月了,自此后,就好久没有写过博客了,在此先跟关注我的博友们说声抱歉.今天,在公司的一个培训作业的驱动以及伟哥那句“再不写博客就开除你”的监督下,我终于重拾旧爱,再次登录博客园,继续与大家分 ...
- js或css文件合并的三种方式推荐
源文档 <http://www.jb51.net/article/32834.htm> 在Web项目的开发中,js,css文件会随着项目的开发变得越来越多,越来越大,这就给给性能方面带来一 ...
- css引入页面的三种方法
1.内联式:直接在标签上写样式 <!DOCTYPE html> <html lang="en"> <head> <meta charset ...
- CSS：概念和三种样式
简介: CSS(Cascading Style Sheets):层叠样式表,它用来控制HTML标签的样式,给网页结构穿衣服~ CSS的编写格式是键值对的形式 -> 格式:属性名 : 属性值: ...
- 纯Css绘制三角形箭头三种方法
在制作网页的过程中少不了绘制类似图片的三角形箭头效果,虽然工程量不大,但是确实麻烦.在学习的过程中,总结了以下三种方法,以及相关的例子. 一.三种绘制三角形箭头方法 1.方法一:利用overflow: ...
- [HTML/CSS]创建新元素的三种方法
第一种:通过text/HTML var txt1="<h1>Text.</h1>"; 第二种:通过jQuery var txt2=$("<h ...
随机推荐
- struts2生成随机验证码图片
之前想做一个随机验证码的功能,自己也搜索了一下别人写的代码,然后自己重新用struts2实现了一下,现在将我自己实现代码贴出来!大家有什么意见都可以指出来! 首先是生成随机验证码图片的action: ...
- Python网络编程笔记一
AF_INET:IPV4 AF_INET6:IPV6 套接字类型: SOCK_STREAM:TCP SOCK_DGRAM:UDP 创建TCP套接字,也可以不传递参数,默认创建TCP套接字 tcpSoc ...
- python tkinter动态追加按钮等控件可能遇到的问题
小爬最近给同事制作一个小爬虫:具体要求: 1.每天自动定时触发: 2.模拟用户自动登陆: 3.自动爬取对应API接口数据: 4.对爬取结果进行逻辑判断,对符合条件的数据进行规则化列示: 5.列示的行项 ...
- ArrayList、LinkedList、Vector、CopyOnWriteArrayList的区别和源码分析
1. ArrayList ArrayList 是一个数组队列,相当于动态数组.与Java中的数组相比,它的容量能动态增长.它继承于AbstractList,实现了List, RandomAccess, ...
- 记一次线上 OOM 和性能优化
大家好,我是鸭血粉丝(大家会亲切的喊我 「阿粉」),是一位喜欢吃鸭血粉丝的程序员,回想起之前线上出现 OOM 的场景,毕竟当时是第一次遇到这么 紧脏 的大事,要好好记录下来. 1 事情回顾 在某次周五 ...
- HTML和JavaScript代码分离、平稳退化（1）
使用的编辑器是Hbuilder,浏览器是Chrome. HTML和JavaScript代码分离,会使得修改网页功能和代码的阅读与维护会轻松的许多,不用在DOM中阅读大量的JavaScript代码. 文 ...
- 用c++ 给易语言写支持库学习记录
废话我就不对说 直接开始 易语言官方下载的易语言安装路径下 有一个SDK文件夹 我们点进入cpp文件夹里面提供是c++的SDK elib文件夹里就是sdk 我们新建一个win32项目 这里我用的是VS ...
- $splay$学习总结$QwQ$
省选之前就大概搞了下$splay$,然后因为时间不太够就没写总结了,,,然后太久没用之后现在一回想感觉跟没学过一样了嘤嘤嘤 所以写个简陋的总结,,,肥肠简陋,只适合$gql$复习用,不建议学习用 然后 ...
- Shell one
1.shell的运算符包括:算术运算符.关系运算符.布尔运算符.字符串运算符.文件测试运算符 1.1原生bash不支持简单的数学运算,但是可以通过其他命令来实现,例如 awk 和 expr,expr ...
- spring之为什么要使用AOP（面向切片编程）？
需求1-日志:在程序执行期间追踪正在发生的活动: 需求2-验证:希望计算器只处理正数的运算: 一.普通方法实现 Calculator.java package com.gong.spring.aop. ...