• 技术文章 >web前端 >css教程

    CSS父级子级怎么使用

    php中世界最好的语言php中世界最好的语言2017-12-01 14:51:58原创3704
    在我们进行前端项目的时候,一定要弄清元素模块之间的父级的关系,这样我们就能更方便的维护和查找使用元素。今天就给大家好好介绍一下。

    简单讲CSS父级 CSS子级是相对而言,如一个DIV “A”被另外一个DIV “B”包裹着,这样我们就可以认为B是A父级,同样一个道理。

    父级子级或有时把DIV嵌套关系比作父亲儿子关系,这个是为了便于理解将DIV嵌套关系形象比作父级子级关系叫法。

    、举例说明:

    DIV CSS 父级子级说明例子:

    CSS代码

    .yangshi{...} 
    .yangshi .yangshi_a{ ...} 
    .yangshi .yangshi_b{ ...}

    Div代码

    <div class="yangshi"> 
    <div class="yangshi_a">内容a</div> 
    <div class="yangshi_b">内容b</div> 
    </div>

    以上div+css代码这里我们就可以认为 yangshi_a父级(上一级)是yangshi。

    这样我们就可以利用CSS指针属性在div css中,最终CSS样式可以有相同命名的属性选择器的,但是赋予不同的值。

    这样我们通过.yangshi .yangshi_a一看即可知道yangshi_a的父级是yangshi


    相信看了这些案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

    相关阅读:

    Css3中的transform 渐变属性怎么使用

    Css3制作动态开关的效果的实现步骤

    用CSS3优化HTML5表单的步奏

    以上就是CSS父级子级怎么使用的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。

    前端(VUE)零基础到就业课程:点击学习

    清晰的学习路线+老师随时辅导答疑

    自己动手写 PHP MVC 框架:点击学习

    快速了解MVC架构、了解框架底层运行原理

    专题推荐:样式表 css 使用
    上一篇:网页制作中margin-top的实例教程 下一篇:自己动手写 PHP MVC 框架(40节精讲/巨细/新人进阶必看)

    相关文章推荐

    • ❤️‍🔥共22门课程,总价3725元,会员免费学• ❤️‍🔥接口自动化测试不想写代码?• 实例详解CSS渐变锯齿问题如何解决!• 聊聊CSS新特性content-visibility,助你提升页面渲染性能• 另辟蹊径!看看使用CSS滤镜怎么构建圆角和波浪效果• 详解css中的比较函数(示例介绍)• 聊聊怎么利用 CSS 构建花式透视背景
    1/1

    PHP中文网