一、属性

属性:表示事物的一些特征

属性分为标签属性和样式属性

标签属性:<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的更多相关文章

  1. 23----2013.07.01---Div和Span区别,Css常用属性,选择器,使用css的方式,脱离文档流,div+css布局,盒子模型,框架,js基本介绍

    01 复习内容 复习之前的知识点 02演示VS创建元素 03div和span区别 通过display属性进行DIV与Span之间的转换.div->span 设置display:inline   ...

  2. Jquery选择器大全、属性操作、css操作、文档、事件等

    一.简介   定义  jQuery创始人是美国John Resig,是优秀的Javascript框架: jQuery是一个轻量级.快速简洁的javaScript库. jQuery对象  jQuery产 ...

  3. CSS属性选择器温故-4

    1.属性选择器就是通过元素属性来找到元素 2.属性选择器语法 CSS3遵循了惯用的编码规则,通配符的使用提高了样式表的书写效率,也使CSS3的属性选择器更符合编码习惯 3.浏览器兼容性 CSS选择器总 ...

  4. CSS 属性选择器(八)

    一.属性选择器 属性选择使用中括号进行标识,中括号内包含属性名,属性值或者属性表达式 如h1[title],h1[title="Logon"], 二.属性选择器分类 2.1.匹配属 ...

  5. CSS笔记(二)CSS属性选择器

    对带有指定属性的HTML元素设置样式. 参考: http://www.w3school.com.cn/css/css_syntax_attribute_selector.asp 选择器 描述 [att ...

  6. IE7浏览器下CSS属性选择器二三事

    一.为何专门说起IE7 以前,或者说数年前,我们从事桌面端网页开发的时候,基本上都还要兼顾IE6浏览器, 即使有些特性,IE7支持,我们也会忽略之.于是,我们会不自然地把IE6和IE7浏览器归为一路货 ...

  7. css笔记04:属性选择器

    1.属性选择器: 带有 title 属性的所有元素设置样式: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN ...

  8. css中的7中属性选择器

    在CSS的选择符中有七个属性选择符.它们分别是: 1.E[att] 选择具有att属性的E元素. 2.E[att="val"] 选择具有att属性且属性值等于val的E元素. 3. ...

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

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

  10. CSS 选择器之基本选择器 属性选择器 伪类选择器

    CSS 选择器 常见的选择器列表图 CSS选择器笔记 基本选择器 通配符选择器(*) 元素选择器(E) 类选择器(.className)    所有浏览器都支持类选择器,但多类选择器(.classNa ...

随机推荐

  1. Entity Framework Code-First(6):Database Initialization

    Database Initialization: We have seen that Code First creates a database automatically in the Simple ...

  2. 2. Web渗透测试中常见逻辑漏洞解析与实战

    注:以下漏洞示例已由相关厂商修复,切勿非法测试! 0x01 漏洞挖掘 01  注册 注册中最常见的有两个,一个是恶意注册,另一个是账户遍历.一个好的注册界面应该是这样 或者这样的 而不是这样的 要么使 ...

  3. hadoop fs -put上传文件失败,WARN org.apache.hadoop.hdfs.server.datanode.DataNode: Problem connecting to server: master:8020

    hadoop fs -put上传文件失败 报错信息:(test文件夹是已经成功建好的) [root@master ~]# hadoop fs -put test1.txt /test // :: WA ...

  4. 网易 UI 自动化工具 Airtest 浅用记录

    一 使用目的 该工具主要是面向游戏UI测试基于图像识别,如游戏框架unity,Cocos-js以及网易内部的游戏框架 同时也支持原生Android App 的基于元素识别的UI自动化测试. 本文主要使 ...

  5. PS2018学习笔记(19-24节)

    19-随心所欲变换 # 本节知识点 自由变换 移动变换 旋转变换 斜切变换 变形变换 扭曲变换 透视变换 # 本节段落表 自由变换命令 变换中的移动 再次变换命令 对象缩放 旋转 斜切 变形 扭曲 透 ...

  6. 如何给自己的开源项目选择和添加 License

    License 的作用:开源 == 为所欲为? 开源并不等于为所欲为! 代码的用途,修改之后的代码有什么要求,开源程序对于原作者的权利和责任等等,都是需要明确的. 开源协议 License 就是这么一 ...

  7. game with probability problem

    两个人 A, B 取 n 枚石子,祂们轮流抛硬币 (A 先手),每次抛硬币,如果是正面,就取出一枚石子,否则什么都不做,然而 A, B 有一种超能力,在抛硬币前在意志中确定一面 (正面或反面),然后就 ...

  8. 2017-10-5 清北刷题冲刺班a.m

    行列式 序列 #include<iostream> #include<cstdio> #define maxn 500010 using namespace std; int ...

  9. 为什么要把系统拆分成分布式的,为啥要用Dubbo?

    阅读本文大概需要 6 分钟. 作者:yanglbme 1.面试题 为什么要进行系统拆分?如何进行系统拆分?拆分后不用 dubbo 可以吗? 2.面试官心里分析 从这个问题开始就进行分布式系统环节了,好 ...

  10. POJ3274-Gold Balanced Lineup

    题目链接:点击打开链接 Gold Balanced Lineup Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 16978 ...