0 0
Read Time52 Second

Halo Gengss,,, Mr. Jibrut kali ini akan sharing tentang jenis Style Output SASS

Sass mendukung 4 tipe output style css, 4 tipe tersebut adalah :

  1. nested
  2. compact
  3. expanded
  4. compressed
sass --watch scss:css --style compressed

di atas adalah contoh command line untuk menproses scss/sass menjadi css model compressed. jika ingin tipe lain ganti saja compressed menjadi nested, compact, atau expand.

Berikut penjelasan tiap tipe

    1. Nested
Hasil Tipe Nested

.header {
    height: auto; }
    .header .header-wrap {
       margin: 0 auto;
       width: 800px; }
    .header .header-wrap .header-img {
       float: left;
       width: 30%; }
}
    1. Expanded
Hasil Tipe Expanded

.header {
  height: auto;
}
.header .header-wrap {
  margin: 0 auto;
  width: 800px;
}
.header .header-wrap .header-img {
  float: left;
  width: 30%;
}
    1. Compact
Hasil Tipe Compact

.header { height: auto; }
.header .header-wrap { margin: 0 auto; width: 800px; }
.header .header-wrap .header-img { float: left; width: 30%; }
  • Compressed
Hasil Tipe Nested

.header{height:auto}.header .header-wrap{margin:0 auto;width:800px}.header .header-wrap .header-img{float:left;width:30%}

sumber : https://web-design-weekly.com/2014/06/15/different-sass-output-styles/

About Post Author

TahuBanyak

Happy
Happy
0 %
Sad
Sad
0 %
Excited
Excited
0 %
Sleepy
Sleepy
0 %
Angry
Angry
0 %
Surprise
Surprise
0 %
Previous post Cara Memperbesar ‘Pixel Art’ Tanpa Membuat Blur
Next post Fade Out Saat Hover Menggunakan CSS3

Average Rating

5 Star
0%
4 Star
0%
3 Star
0%
2 Star
0%
1 Star
0%

Leave a Reply

Your email address will not be published. Required fields are marked *