文章彙整

SASS的二種註解方式 /* */ 與 //

By Astral Web 3 years agoNo Comments
首頁  /  網站設計與開發  /  SASS的二種註解方式 /* */ 與 //

SASS的二種註解方式 /* */ 與 //

SASS的註解方式有二種:多行註解及單行註解

 

多行註解

使用多行註解時,註解起來的訊息會在一併輸出在CSS上

SASS的二種註解方式 /* */ 與 //

 

 

SASS

@import "compass/css3";

.well {
  min-height: 20px;
  padding: 19px;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  border-radius: 4px;
  @include box-shadow(inset 0 1px 1px rgba(0,0,0,.05));
  blockquote {
    /*border-color: #ddd;
    border-color: rgba(0,0,0,.15);*/
  }
}

CSS

.well {
  min-height: 20px;
  padding: 19px;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  border-radius: 4px;
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
}
.well blockquote {
  /*border-color: #ddd;
  border-color: rgba(0,0,0,.15);*/
}

 

單行註解

使用單行註解的方式所註解起來的訊息則不會輸出在CSS上

SASS的二種註解方式 /* */ 與 //
SASS

@import "compass/css3";

.well {
  min-height: 20px;
  padding: 19px;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  border-radius: 4px;
  @include box-shadow(inset 0 1px 1px rgba(0,0,0,.05));
  blockquote {
    // border-color: #ddd;
    // border-color: rgba(0,0,0,.15);
  }
}

CSS

.well {
  min-height: 20px;
  padding: 19px;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  border-radius: 4px;
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
}

 

 

 

以上內容由Astralweb 歐斯瑞編寫製作

 000

推薦文章

Category:
  網站設計與開發

留下回應

你的電子郵件地址不會被公開.

取得獨家電子商務祕技

建立更好的策略靈感

跟上全球的網路趨勢

絕佳的電商解決方案

電子商務戰略全指南

每月發送電商戰略指南,只要填寫E-mail即可訂閱!

請到您的信箱確認,即可完成訂閱。