css不能嵌套吗?


css不能嵌套吗?

原生的css不支持嵌套写法,但是我们可以使用css的扩展语言sassless来实现嵌套。

sass和less都是css的拓展语言,less和sass最主要的区别是less是通过Javascript编译,而sass是通过ruby编译的,所以我们可以在网页中引入less.js文件,这样就能使用css嵌套语法了。

例子:

<!DOCTYPE html>
<html >
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/less">
        .a{
            padding: 20px;
            .b{
                color: red;
            }
         }
    </style>
</head>
<body>
  <div class="a">
    <p class="b">b</p>
  </div>
  <script src="https://cdn.bootcss.com/less.js/3.0.4/less.min.js"></script>
</body>
</html>

效果:

Snipaste_2019-12-26_17-02-08.jpg

Image placeholder
前端答疑
未设置
  90人点赞

没有讨论,发表一下自己的看法吧

推荐文章
css不同浏览器兼容性问题怎么解决?

css不同浏览器兼容性问题的解决方案1.浏览器CSS样式初始化由于每个浏览器的css默认样式不尽相同,所以最简单有效的方式就是对其进行初始化,相信很多朋友都写过这样的代码,在所有CSS开始前,先把ma

php中css不加载怎么解决?

php中css不加载怎么解决?解决方法:1、首先打开HTML文档;2、然后在head标签中找到引入css文件的link标签;3、最后在link标签的href属性的值前面,加上__STATIC__即可。

link标签引入css不起作用怎么办?

link标签引入css不起作用怎么办?1、使用link标签引用CSS:2、link无效的问题:●原因多数是css路径写的不正确。路径分为相对路径和绝对路径。如果是相对路径要仔细检查路径是否和文件相对应

iis不加载css怎么办?

iis不加载css怎么办?解决方法:打开或关闭window功能中的Internet信息服务里的万维网服务=>常见HTTP功能=>静态内容选中后安装即可。

html和css不换行代码是什么?

html和css不换行代码是什么?一、HTML不换行代码:在网页排版布局中比如文章列表标题排版,无论多少文字均不希望换行显示,需要强制在一行显示完内容。这就可以nobr标签来实现。语法:内容不换行内容

iis不显示css引用的图片?

iis不显示css引用的图片?原因有两个:项目文件夹权限问题未开启IIS的静态内容功能(相关课程推荐:css视频教程)解决方法:1、文件夹权限问题的解决方法项目文件夹→属性→安全→编辑→添加→高级→立

从Oracle到MongoDB:为什么AWS不断抛弃合作伙伴?

亚马逊因不断与其商业伙伴分道扬镳而备受关注,在决定放弃Oracle数据库转而使用自己的服务之后,Amazon现在正在尝试用自己的“兼容”版本DocumentDB取代MongoDB。有趣的是,AWS宣布

Jquery怎么让contains不区分大小写?

Jquery怎么让contains不区分大小写?默认的Jquerycontains方法是区分大小写的,以下方法可以使contains不区分大小写(在匹配时将要匹配的元素内容全部转换成小写再进行匹配)/

【CSS全解01】CSS基础-体系化学CSS

大纲 基础部分学习占比:HTML1%`CSS19%Javascript80%`(`基础部分?%框架?%`项目?%) CSS历史 AcidTestforbrowser CSS是艺术(非逻辑,用测试经验来

不一样的css,sass(scss)的基本使用

前言此文主要记录sass的scss语法的基本使用。sass是css的预编译器,它扩展一些css所没有的变量的定义、条件控制、循环、自定义方法等。基础内容1.变量/*scss*/ //声明变量 $pri

nginx 如何实现 if 嵌套

nginx不支持if嵌套,也不允许在if中使用逻辑判断,会报如下错误: nginx:[emerg]"if"directiveisnotallowed 当业务需要多个条件判断时,可以借助中间变量来实

pr嵌套有什么用?

课程推荐:web全栈开发就业班--拿到offer再缴学费--融职教育 pr嵌套的作用   1、使用嵌套可以使自己对不同的素材进行快速的处理,比如调色,做动画,以及做画中画效果。   2、它不仅能使时

nginx不能访问css怎么办

nginx不能访问css怎么办在Nginx配置文件nginx.conf中内添加location~.*\.(gif|jpg|jpeg|png|bmp|swf|css|js|eot|svg|ttf|wof

ie11下不能引入外部css怎么解决?

ie11下不能引入外部css怎么解决?问题:在IE11下使用link标签引入css时,无法正常引入,直接在页面中使用style标签没问题。原因:头文件的问题。解决方法:●删除头部的●或者,将头部改成

css3.0和css2.0区别?

css3.0和css2.0区别?css3加强了css2的功能,增加了新的属性和新的标签,并且删除了一些冗余的标签,在布局方面减少了代码量。以前比较复杂的布局现在一个属性就搞定了(columns之类的属

css1和css2的区别是什么?

css1和css2的区别是什么?CSS1提供有关字体、颜色、位置和文本属性的基本信息,该版本已经得到了目前解析HTML和XML的浏览器的广泛支持。CSS2.0提供给我们了一个机制,让开发时可以不考虑显

css语言难学吗?

CSS难学吗?css入门容易,想学深还是挺难的;学习css需要多加练习。CSS为什么难学CSS属性很多,难以一次性记下来CSS属性之间互相影响,难以完全掌握CSS核心概念都写在文档中,但是如果不熟悉一

html和css难学吗?

什么是HTML?html是HyperTextMark-upLanguage的缩写,即超文本标记语言;html是网页的结构(Structure)。html是用来定义文档内容结构的,包含了用户需要浏览的内

css有不可继承属性吗?

css继承性:CSS继承可定义为特定的css属性向下传递到子孙元素,就是指被包在内部的标签将拥有外部标签的样式,即子元素可以继承父元素的属性。继承是一种规则,它允许样式不仅应用于某个特定html标签元

css3有内置图标吗?

css3有内置图标吗?css3没有内置图标,所有的图标都需要用户自己下载后使用。但是我们可以通过设置特殊字符,来实现图标的样式。(推荐学习:CSS视频教程)下面是一个特殊字符来代替图标的案例:

css能判断手机是安卓还是ios吗?

css能判断手机是安卓还是ios吗?css不能判断手机是安卓还是ios,css只能通过媒体查询判断屏幕宽度。判断是安卓还是ios需要使用javascript。下面我们来看看使用javascript判断

css属于脚本语言吗?

css属于脚本语言吗?css不属于脚本语言,它是层叠样式表,是一种用来表现HTML或XML等文件样式的计算机语言。另外HTML也不是脚本语言,HTML是超文本标记语言,用来描述文档结构的。脚本语言脚本

css中font属性能不按顺序吗?

css中font属性能不按顺序吗?不能,font属性的书写必须按照顺序。css中的复合属性,有的可以不按照顺序,有的不行的,border的顺序可以乱,但是font的就不能乱。(推荐学习:CSS视频教程

dw cs6怎么保存为css格式

dwcs6怎么保存为css格式1、首先,打开DreamweaverCS6,新建一个css文档,选中“css”,点击确定按钮。2、将设计好的css样式放入该页面,@charset"utf-8";用来指定

wordpress无法加载css

wordpress无法加载css出现这种情况是因为wordpress安装时用http://localhost访问来安装,局域网访问时,加载css的路径不对,所以会出现css无法加载,只显示文字。解决方