在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 教程/ HTML/ Sass @at-root指令
Sass @debug指令
Sass @each指令實例
Sass @import指令
Sass SassScript &符號
Sass操作符
Sass多行注釋插值法
Sass if()函數(shù)
Sass @規(guī)則和指令
Sass through關(guān)鍵字
傳遞內(nèi)容塊到Mixin
Sass @media指令
Sass @warn指令
Sass嵌套規(guī)則
Sass @error指令
Sass @if指令實例
Sass變量
擴(kuò)展Sass
Sass嵌套屬性
Sass @at-root指令
Sass @for指令
Sass @extend指令
Sass CSS擴(kuò)展
Sass語法
Sass @if指令
Sass占位符選擇器
Sass 定義Mixin
Sass括號混合
SASS教程
Sass布爾運(yùn)算符
Sass引用父選擇器
Sass @else if指令
Sass數(shù)據(jù)類型
Sass數(shù)字運(yùn)算符
Sass to關(guān)鍵字
Sass @each多重分配與映射
Sass顏色運(yùn)算符
Sass交互式shell
Sass控制指令&表達(dá)式
Sass的使用
Sass混入指令
Sass腳本
Sass插值
Sass安裝
Sass函數(shù)指令
Sass @each多重分配
Sass @each指令
Sass變量默認(rèn)值
Sass包含mixin
Sass注釋
Sass @while指令
Sass Mixin參數(shù)
Sass字符串運(yùn)算符
Sass函數(shù)
Sass輸出樣式

Sass @at-root指令

@at-root指令是嵌套的規(guī)則的集合,它能夠使樣式塊在文檔的根目錄。

@at-root (without: ...) 以及 @at-root (with: ...)

@at-root 選擇器默認(rèn)不包括選擇器。通過使用@at-root我們可以將嵌套指令之外的樣式。例如,創(chuàng)建一個SASS文件,用下面的代碼:
@media print {
  .style {
    height: 8px;
    @at-root (without: media) {
      color: #808000;;
    }
  }
上面的代碼將被編譯到CSS文件,如下所示:
@media print {
  .style {
    height: 8px;
    }
 }
.style {
   color: #808000;
}

示例

下面的例子演示了使用 @at-root 在SCSS文件:

atroot.htmll

<!doctype html>
<head><meta charset="UTF-8"> <title>At-root 示例-www.yiibai.com</title>
	<link rel="stylesheet" href="atroot.css" type="text/css" />
</head>
<body class="container">
    <h2>使用at-root實例</h2>
    <p class="style">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</body>
</html>
接下來,創(chuàng)建文件 atroot.scss

atroot.scss

h2{
color: #808000;
background-color: #DB7093;

@at-root {
.style{
	font-size: 20px;
	font-style: bold;
	color: #B8860B;
	}
	}
}
可以告訴SASS監(jiān)視文件,并隨時使用下面的命令更新 SASS 文件來修改 CSS:
sass --watch C:\Ruby22-x64\atroot.scss:atroot.css
接著執(zhí)行上面的命令,它會自動創(chuàng)建atroot.css文件,下面的代碼:

atroot.css

h2 {
   color: #808000;
   background-color: #DB7093;
}
.style {
   font-size: 20px;
   font-style: bold;
   color: #B8860B;
}

執(zhí)行輸出結(jié)果

讓我們來執(zhí)行以下步驟,看看上面的代碼工作:
保存上面的html代碼到atroot.htmll文件。
在瀏覽器中打開該HTML文件,得到輸出如下顯示