<!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. 【题解】AC自动机题解合集

    最近貌似大家都在搞字符串?很长一段时间都没有写博客了……还是补一补坑吧. 感觉AC自动机真的非常优美了,通过在trie树上建立fail指针可以轻松解决多模匹配的问题.实际上在AC自动机上的匹配可以看做 ...

  2. 【BZOJ5338】[TJOI2018]异或（主席树）

    [BZOJ5338][TJOI2018]异或(主席树) 题面 洛谷 题解 很明显的是\(Trie\)树上暴力判断答案 因为要支持区间,用主席树的结构存\(Trie\)树就好了 #include< ...

  3. mysqldump备份恢复

    数据库的备份恢复是DBA的必修课,本文首先讲解mysqldump完整备份恢复的操作方法,演示数据库完整备份的基本过程.然后再模拟数据库遭遇灾难性破坏,配合bin-log日志实验数据库灾难性恢复的步骤. ...

  4. oracle 远程登录sqlplus TNS：无监听

    1.将localhost 改成 计算机名 best-PC,或者ip地址 .  我修改成计算机名,因为经常在无线网络和有限网络之间切换 SID_LIST_LISTENER =  (SID_LIST =  ...

  5. [CodeVs3196]黄金宝藏（DP/极大极小搜索）

    题目大意:给出n(≤500)个数,两个人轮流取数,每次可以从数列左边或者右边取一个数,直到所有的数被取完,两个人都以最优策略取数,求最后两人所得分数. 显然这种类型的博弈题,第一眼就是极大极小搜索+记 ...

  6. 解题：HNOI 2008 玩具装箱

    题面 搞了一晚上斜率优化,大概懂了一点,写写 原来常用的优化dp方法:做前缀和,预处理,数据结构维护 现在有转移方程长这样的一类dp:$dp[i]=min(dp[i],k[i]*x[j]+y[j]+c ...

  7. Linux基础--------监控系统、进程管理、软件包管理-------free、dd、kill、 rpm、yum、源码安装python

    作业一:1) 开启Linux系统前添加一块大小为15G的SCSI硬盘 2) 开启系统,右击桌面,打开终端 3) 为新加的硬盘分区,一个主分区大小为5G,剩余空间给扩展分区,在扩展分区上划分1个逻辑分区 ...

  8. 手脱nSPack 3.7

    方法一: 1.   OD查壳—nSpack3.7的壳 2. 载入OD 看起来很眼熟,F8一次,然后下面就可以使用ESP定律了,使用ESP定律下断点,然后F9四次 3.   F9四次后落到这个位置 接下 ...

  9. Eclipse 反编译插件

    很多时候在项目开发中,没有源码是挺痛苦的一件事情,我们要知其然,更要知其所以然,但是有些公司就是不提供源码,怎么办? 不怕,下面教大家在Eclipse下安装反编译插件,方便好用. 好了,点 点 点 都 ...

  10. Ubuntu 14.04 安装Visual studio Code

    上一篇简单介绍了Ubuntu 14.04上如何创建.运行 hello world 程序. 这篇介绍Ubuntu 14.04如何安装Visual studio Code. 网上推荐的有通过Ubuntu ...