属性,选择器和css
一、属性
属性:表示事物的一些特征
属性分为标签属性和样式属性
标签属性:<img src="1.jpg" width="200px" heifht="200px"/>
样式属性:<style>
p{
color:red;
}
二者的区别:1、位置不一样 —— 样式属性写在style中 标签属性写在标签内
2、写法不一样 —— 样式属性是属性:属性值,标签属性是属性="属性值"
二、选择器
1、样式到底按什么要求?
由选择器的权重来决定的
注:标签的权重是1, class的权重是10, id的权重是100.
权重是可以叠加的
2、浏览器是如何去执行代码?
浏览器执行代码是从上到下,从左到右。
3、选择器的种类
1)、标签选择器
2)、id选择器
3)、class选择器
4)、后代选择器
p a{
color: red; 标签嵌套多层(包括一层)
}
5)、子代选择器
.pp>a{
color: red; 标签嵌套只有一层关系
}
6)、交集选择器
#p.aa {
color: red;
}
注:千万不能把标签写在后面,如:.app
三、CSS
1、CSS:层叠样式表
目的:是给html添加样式
<style type="text/css"></style>
2、网页中如何嵌套style样式
1)、行间样式:把style当做属性写在标签内
<p style="color: red;">heello</p>
2)、行内样式: 把style当作做标签来用写在head之间
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
p{
color: red; 行内标签
}
</style>
</head>
3)、把style当做CSS文件来用。外部引用
<link type="text/css" rel="stylesheet" href="./01.css">
注:rel和href是必不可少的
双标签 必须写结束标签,p可以忽略结束标签
3、CSS的三种引入方式:
1)、行间样式:把style当做属性来使用,键值对在属性值中该怎么用就怎么用;
2)、行内样式:把style当做标签来使用,键值还是老样子;
3)、外部引入:将样式写在CSS文件中,还是以键值对形式书写样式。
属性,选择器和css的更多相关文章
- 23----2013.07.01---Div和Span区别,Css常用属性,选择器,使用css的方式,脱离文档流,div+css布局,盒子模型,框架,js基本介绍
01 复习内容 复习之前的知识点 02演示VS创建元素 03div和span区别 通过display属性进行DIV与Span之间的转换.div->span 设置display:inline ...
- Jquery选择器大全、属性操作、css操作、文档、事件等
一.简介 定义 jQuery创始人是美国John Resig,是优秀的Javascript框架: jQuery是一个轻量级.快速简洁的javaScript库. jQuery对象 jQuery产 ...
- CSS属性选择器温故-4
1.属性选择器就是通过元素属性来找到元素 2.属性选择器语法 CSS3遵循了惯用的编码规则,通配符的使用提高了样式表的书写效率,也使CSS3的属性选择器更符合编码习惯 3.浏览器兼容性 CSS选择器总 ...
- CSS 属性选择器(八)
一.属性选择器 属性选择使用中括号进行标识,中括号内包含属性名,属性值或者属性表达式 如h1[title],h1[title="Logon"], 二.属性选择器分类 2.1.匹配属 ...
- CSS笔记(二)CSS属性选择器
对带有指定属性的HTML元素设置样式. 参考: http://www.w3school.com.cn/css/css_syntax_attribute_selector.asp 选择器 描述 [att ...
- IE7浏览器下CSS属性选择器二三事
一.为何专门说起IE7 以前,或者说数年前,我们从事桌面端网页开发的时候,基本上都还要兼顾IE6浏览器, 即使有些特性,IE7支持,我们也会忽略之.于是,我们会不自然地把IE6和IE7浏览器归为一路货 ...
- css笔记04:属性选择器
1.属性选择器: 带有 title 属性的所有元素设置样式: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN ...
- css中的7中属性选择器
在CSS的选择符中有七个属性选择符.它们分别是: 1.E[att] 选择具有att属性的E元素. 2.E[att="val"] 选择具有att属性且属性值等于val的E元素. 3. ...
- css样式表中四种属性选择器
学习此连接的总结http://developer.51cto.com/art/201009/226158.htmcss样式表中四种属性选择器1> 简易属性 tag[class]{ font-we ...
- CSS 选择器之基本选择器 属性选择器 伪类选择器
CSS 选择器 常见的选择器列表图 CSS选择器笔记 基本选择器 通配符选择器(*) 元素选择器(E) 类选择器(.className) 所有浏览器都支持类选择器,但多类选择器(.classNa ...
随机推荐
- 8、泛型程序设计与c++标准模板库2、c++标准模板库中的容器
顺序容器类以逻辑线性排列方式存储元素,在这些容器类型中的元素在逻辑上被认为是连续的存储空间中存储的.顺序容器可用于存储线性群体. 在关联容器类中,元素的存储和检索基于关键字和元素与其他元素之间的关系, ...
- 【创建maven-web项目-eclipse-jee-mars-2-win32-x86_64-jdk1.8】
需要注意的是:创建的mavenweb项目是没有java源文件夹的需要手动添加: 创建项目完成以后,项目会报错,如下: 因为项目中没有添加servlet依赖解决jsp报错问题:添加依赖: <dep ...
- Python-OpenCV中图像颜色空间转换
目录 cv2.cvtColor() 1. RGB to GRAY 2. RGB to CIE XYZ 3. RGB to YCrCb JPEG 4. RGB to HSV 5. RGB to HLS ...
- 《OD大数据实战》Spark入门实例
一.环境搭建 1. 编译spark 1.3.0 1)安装apache-maven-3.0.5 2)下载并解压 spark-1.3.0.tgz 3)修改make-distribution.sh VER ...
- hdu 1729 Stone Game
Stone Game HDU - 1729 题意: 给定n个箱子,每个箱子的容量为si,每个箱子里最初有ci个石子,每次放入石子不能超过放入前的石子数的平方,谁无法继续放入石子就算输. /* 这是 ...
- 通过sql语句对MySql数据库的基本操作
一.数据库的基本操作 CREATE DATABASE mybookstore; DROP DATABASE mybookstore; 二.表的基本操作 1.创建表 insert into 表名(字段名 ...
- 求最短路径(Bellman-Ford算法与Dijkstra算法)
前言 Dijkstra算法是处理单源最短路径的有效算法,但它局限于边的权值非负的情况,若图中出现权值为负的边,Dijkstra算法就会失效,求出的最短路径就可能是错的.这时候,就需要使用其他的算法来求 ...
- POJ 2891 Strange Way to Express Integers excrt/我真傻,真的
我真傻,真的 我单知道这道题在(b-b1)%d!=0时要判无解,哪成想自己却没有读完这组后面的数据而直接break掉...qwqfk 当 $ x \equiv b_1 ( mod a_1 ) ...
- 【补档】Pycharm的一些配置
新建和创建文件就不必说了吧~ 运行这里原本是灰色的,我们点旁边的三角形 点绿色+号,python Name:随便写 Script:选择一个py文件~,然后OK,就可以运行了
- Vue 4 -- 获取原生的DOM的方式、DIY脚手架、vue-cli的使用
一.获取原生的DOM的方式 在js中,我们可以通过id.class或者标签获取DOM元素,vue中也为我们提供了获取原生DOM的方法,就是给标签或者组件添加ref属性,通过this.$refs获取,如 ...