<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">   <!-- 指定编码 -->
    <title>liudaozhang</title>
    <link rel="shortcut icon" href="http://www.xxxxx.cn:80/wp-content/logo.jpg">
    <!--<link rel="stylesheet" href="jjj.css">  这是第三种___引入css-->
    <!--<link rel="stylesheet" href="jjj2.css">  这是第三种___引入css-->
    <style>
        /*id选择器   这是第二种方式*/
        /*#i1{*/
            /*height: 100px;*/
            /*width: 100px;*/
            /**/
        /*}*/
/*这里会先引用style中的标签，然后在引用link中jjj2  再试jjj中的标签*/

        /*class选择器*/
        /*.c1{*/
            /*height: 100px;*/
            /*width: 100px;*/
            /**/
        /*}*/

        /*标签选择器*/
        /*div {*/
            /*height: 100px;*/
            /*width: 100px;*/
            /**/
        /*}*/

        /*标签层级选择器  --行内标签无法应用  宽  高等属性*/
        /*div span{*/
            /*height: 100px;*/
            /*width: 100px;*/
            /**/
        /*}*/

        /*class层级选择器*/
        /*.c2 span{*/
            /*height: 100px;*/
            /*width: 100px;*/
            /**/
        /*}*/

        /*id层级选择器*/
        /*#i2 span{*/
            /*height: 100px;*/
            /*width: 100px;*/
            /**/
        /*}*/

        /*id组合选择器*/
        /*#i1,#i2,#i3{*/
            /*height: 100px;*/
            /*width: 100px;*/
            /**/
            /*margin-top: 5px; 间隔作用*/
        /*}*/

        /*class组合选择器*/
        /*.c1,.c2,.c3{*/
            /*height: 100px;*/
            /*width: 100px;*/
            /**/
            /*margin-top: 5px;*/
        /*}*/

        /*属性选择器*/
        /*div[jjj='abc']{*/
            /*height: 100px;*/
            /*width: 100px;*/
            /**/
            /*margin-top: 5px;*/
        /*}*/

    </style>

</head>
<body>

<!--1、可以在任意标签中添加style属性，增加css样式-->
<!--<div style="height: 100px;width: 100px;border:red 2px solid;"></div>-->
<!--<div id="i1"></div>  引入i1选择器-->

<!--2、head中style添加css样式-->
<!--理解：在标签当中增加了一个id的属性 他的属性就是i1 在head中通过style标签，以id选择器的方式 #i1写了一个css样式 他引用到了div这个标签上-->
<!--简单的说 就是在head中写了id选择器i1 写了css样式 在后面的div标签中引用了这个-->

<!--3、引入 css-->
<!--<div id="i2"></div>  引入i2选择器-->
<!--选择器在是唯一的  不能重复  重复就会报错-->

<!--测试三种引入css样式的方式的优先级-->
<!--<div id="i1" style="height: 100px;width: 100px;"></div>-->
<!--顺序  先引用--这里是为了测试优先级 所以选择器都是使用的i1-->
<!--1、 标签中css  style属性  优先级最高  也就是div后面的优先级别是最高的-->
<!--2、引入的css和head中的style中的标签的优先级  主要是看在head中是由下往上一次查找 那个在最下面就先被引用-->

<!--id选择器不能重复  但是class是可以重复的-->

<!--<div class="c1"></div>  class选择器-->
<!--<div class="c1"></div>-->

<!--<div></div>  /*标签选择器*/-->

<!--<div>-->
    <!--行内标签无法应用  宽  高  --层级选择器-->
    <!--<span>1</span>-->
<!--</div>-->

<!--<div>   class层级选择器-->
    <!--行内标签无法应用  宽  高  --层级选择器-->
    <!--<div class="c2">-->
        <!--<span>12222</span>-->
    <!--</div>-->
<!--</div>-->

<!--<div>  id层级选择器-->
    <!--<div id="i2">-->
        <!--<span>2222</span>-->
    <!--</div>-->
<!--</div>-->

<!--<div id="i1"></div>  id组合选择器-->
<!--<div id="i2"></div>-->
<!--<div id="i3"></div>-->

<!--<div class="c1"></div>  class组合选择器-->
<!--<div class="c2"></div>-->
<!--<div class="c3"></div>-->

<!--<div jjj="abc"></div>   属性选择器-->

</body>
</html>

html基础-css-选择器的更多相关文章

  1. css基础-css选择器和css文本样式相关

    css基础-css选择器和css文本样式相关: 使用link链入外部样式,页面加载时会同时加载样式 @import url(“*.css”);使用导入式,页面加载完后,才会加载样式 链接伪类的顺序 : ...

  2. css基础,css选择器

    07.29自我总结 css基础 一.什么是CSS CSS是级联样式表 CSS术语标记语言,没有逻辑 CSS作用 完成网页内容的样式与布局 二.CSS的三种引入方式 1. 内联式 书写位置:在 head ...

  3. HTML+css基础 css选择器的种类

    css选择器的种类 标签   权重是001 类  class权重是0010 相当于255个标签选择器 Id   权重是0100相当于255个类 *通配符   代表所有的标签   权重是0000 后代选 ...

  4. HTML+css基础 css选择器 选择器的权重

    css选择器  选择器的权重 在css中,哪个选择器的权重高,就走谁的样式 标签选择器的权重是1 class选择器的权重是10 Id选择器的权重是100 行间样式的权重是1000 带有关键字 !imp ...

  5. Scrapy基础------css选择器基础

    基本语法: * 选择所有节点 #container 选择id为container的节点 .container 选择所有class包含container的节点 li a 选取所有li 下所有a节点 ul ...

  6. HTML5 -入门 (---css样式-------------（css基础与css选择器）---------------------—）

    ---恢复内容开始--- 一css基础入门与css选择器 CSS英文全拼:cascading style sheet 层叠样式表. 在html中使用:要在head中写style标签,所有样式放在sty ...

  7. CSS+DIV入门第一天基础视频 CSS选择器层叠性和继承性

    大家好,我是小强老师, 现在网上的CSS+DIV视频,要么讲的太深,要么太浅,很多初学的同学们总是遇到困难,今天小强老师专门给大家准备了css课程的视频.带你从零基础学习CSS+DIV一直到能独立完成 ...

  8. html基础和CSS选择器

    一.html简单基础 什么是HTML HTML 是用来描述网页的一种语言. HTML 指的是超文本标记语言: HyperText Markup Language HTML 不是一种编程语言,而是一种标 ...

  9. HTML&CSS基础-属性选择器

    HTML&CSS基础-属性选择器 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html源代码 <!DOCTYPE html> <html> & ...

  10. HTML&CSS基础-常用选择器

    HTML&CSS基础-常用选择器 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html源代码 <!DOCTYPE html> <html> & ...

随机推荐

  1. String Problem HDU - 3374（最大最小表示法+循环节）

    题意: 给出一个字符串,问这个字符串经过移动后的字典序最小的字符串的首字符位置和字典序最大的字符串的首字符的位置,和能出现多少次最小字典序的字符串和最大字典序的字符串 解析: 能出现多少次就是求整个字 ...

  2. [AT2000] [agc002_f] Leftmost Ball

    题目链接 AtCoder:https://agc002.contest.atcoder.jp/tasks/agc002_f 洛谷:https://www.luogu.org/problemnew/sh ...

  3. 【BZOJ4516】生成魔咒（后缀自动机）

    [BZOJ4516]生成魔咒(后缀自动机) 题面 BZOJ Description 魔咒串由许多魔咒字符组成,魔咒字符可以用数字表示.例如可以将魔咒字符 1.2 拼凑起来形成一个魔咒串 [1,2]. ...

  4. 【HDU4336】Card Collector （动态规划，数学期望）

    [HDU4336]Card Collector (动态规划,数学期望) 题面 Vjudge 题解 设\(f[i]\)表示状态\(i\)到达目标状态的期望 \(f[i]=(\sum f[j]*p[j]+ ...

  5. ping: unknown host 解决办法

    如果ping命令返回如下错误,那主要的可能性就是系统的DNS设置有误. [root@CentOS5 ~]# ping www.sina.com.cn ping: unknown host www.si ...

  6. 【bzoj4520】K远点对

    Portal --> bzoj4520 Description 给你平面内\(n\)个点的坐标,求欧氏距离下第\(k\)远的点对 Solution 因为kd其实..严格来说挺不熟的用的太少了qw ...

  7. 三元组ADT (数据结构C语言版) C++实现

    很久没用C语言,都忘了C语言中没有引用参数,下面的代码中用到了C语言没有的引用参数. 首先是一些表示状态的全局变量 common.h #define TRUE 1 #define FALSE 0 #d ...

  8. 手脱PEtite v2.1

    1.载入PEID PEtite v2.1 2.载入OD,先F8跟一下 0042C10F > B8 00C04200 mov eax,跑跑排行.0042C000 ; //程序入口点 0042C11 ...

  9. webservice 采用SSL实现加密传输

    本文转自:http://book.51cto.com/art/200906/129770.htm http://yeweiyun868.blog.163.com/blog/static/5637844 ...

  10. 0UE3 材质概要

    材质概要 概述 参数 当创建材质时如何考虑颜色 材质表达式 Abs(求绝对值) 添加 AntialiasedTextureMask AppendVector(向量合并) BumpOffset(凸凹偏移 ...