当前位置:首页 » php学习笔记 » css--父子选择器与后代选择器

css--父子选择器与后代选择器

原创 stpevenchow 63°c 2019年09月29日 20:46 php学习笔记 0条评论
  移步手机端

1、打开你手机的二维码扫描APP
2、扫描左则的二维码
3、点击扫描获得的网址
4、可以在手机端阅读此文章

        <!--         后代选择器
        1、父子选择器,只对子级嵌套关系的标签起作用,但是可以有多层父子选择器语法;父子选择器对所有符合条件的标签都起作用
        2、后代选择器
        下面以span举例 -->
        <div class="div1">
            <span>父子选择器</span>
                <h1>
                    <span>多层次父子选择器</span>
                </h1>    
        </div>
        <div class="div4">    
            好好学习天天向上
            <span>
                好好学习天天向上
                    <span>好好学习天天向上</span>
            </span>
            我最爱学习了
        </div>
        <!--         后代选择器--空格
        对嵌套在其内部的,所有符合设定类型的标签,都加载css样式 -->
        <div class="div5">
            <h1>
                <span>学习php代码很开心</span>
            </h1>
            <div>
                <ul>
                    <li>
                        <span>好好学习天天向上
                        </span>    
                    </li>
                </ul>    
            </div>
        </div>    
        <!--         父子选择器和后代选择器的混合使用
        混合使用的关键,分清楚层级关系,到底是父子还是后代    
        -->
        <div class="div6">
            学习代码要有耐心
            <div>
                <span>不能三天打鱼,二天晒网
                </span>
                <ul>
                    <span>成功有先后,努力就对了</span>
                </ul>    
            </div>    
        </div>    
    </body>    
</head>

下面放上图片

父子与后代选择器.png

总结:
1、群组选择器是为了简化css重复样式
2、兄弟,后代选择器为了减少选择器的命名,为了保证动态添加的标签,可以有样式效果
3、兄弟和后代选择器都是以具有选择器的标签作为定位标签
4、兄弟和后代选择器都是给其它的标签添加css样式,并不是给定位的标签添加样式

欢迎阅读本文,如果本文对您有所帮助,记得收藏/转发☺

本文链接:http://stpeven.com/post/118.html

版权声明:本文为原创文章,版权归 stpevenchow 所有,欢迎分享本文,转载请保留出处!

本文标签:

三人行,必有我师

评论(0)

发表评论:


【顶】 【踩】 【好】 【懵】 【赞】 【表情】

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

推荐阅读
11月25日

php--学习乘方运算,幂运算,哈希散列值,随机数

发布 : | 分类 : php学习笔记 | 评论 : 0人 | 浏览 : 6次
php--学习乘方运算,幂运算,哈希散列值,随机数

<?php学习乘方运算,幂运算,哈希散列值,随机数1,乘方函数,幂函数pow()echo pow('2a', '3a');2的3次方也就是3个2相乘第二个参数,也就是乘方,此处可以为小数参数理论上应该是数字类型,如果是其它类型,会自动转化为数字类型2,求平方根函数sqrt()负数没有平方根,如果参数是负数,返回值为NAN, 表示不存在echo sqrt(9);3,求绝对值函数abs()正数的绝对是其本身,负数的绝对值是正数,0的绝对值是0echo abs(-...

标签 :
11月24日

php--变量检查2

发布 : | 分类 : php学习笔记 | 评论 : 0人 | 浏览 : 7次
php--变量检查2

<?php1, 检查变量是否是null有3种判断方式is_null()isset()empty()首先先说is_null得判断范围1、未定义的变量 $var = '';var_dump(is_null($var));变量不存在,会报错,返回值为true    2、定义未赋值的变量     $int;var_dump(is_null($int));3、被销毁的变量4、赋值为null的变量 ...

标签 :
11月22日

php--变量检查

发布 : | 分类 : php学习笔记 | 评论 : 0人 | 浏览 : 8次
php--变量检查

<?php// 特点:// 1,都只能有一个参数// 2,根据检查类型,符合的返回true,不符合返回false// 1,检查是否是整数 is_int()// 检查变量,如果存储数据为整数,返回true// 检查变量,如果存储数据不是整数,返回false$var = 'abc';var_dump(is_int($var));// 2,检查是否是浮点数 is_float()$var = 1000;var_dump(is_float($var));// 3,检查是否是数值 is...

标签 :
11月21日

php--常量

发布 : | 分类 : php学习笔记 | 评论 : 0人 | 浏览 : 9次
php--常量

 <?php常量通过define()函数来自定义常量参数:1,定义得常量名称,需要时字符串格式2,定义得常量数值,数值必须是标量类型3,第三个参数,不使用如果需要对自定义常量进行数据修改,只能在第一次定义得define()函数中,对定义得数据进行修改define('rm', 15);echo rm;输出结果是15 $int = rmvar_dump($int);输出结果int(15)问题1,不能对常量进行赋值或者修改2,也不能对同一个自定义常量进行多次定...

标签 :
11月20日

php--其它类型转化为数字

发布 : | 分类 : php学习笔记 | 评论 : 0人 | 浏览 : 9次
php--其它类型转化为数字

<?php/*其它类型转化为数字多出现于计算boolean true     1false    0字符串:从字符串左侧起,只转化符合数学形式的部分1, null --- 0*//*$int = 100 + null;echo $int; 输出结果为:1002、true ---1 false ---0*//*$int = 100 + true;echo $int; 输出结果101$int = 100 + false;ec...

标签 :