Mengapa CSS tidak secara bawaan mendukung variabel dan hierarki?


11

Saya baru dalam pengembangan UI, tetapi saya merasa sangat tidak nyaman dengan cara kerja CSS.

Kasus penggunaan saya adalah bahwa saya ingin menerapkan beberapa gaya khusus divdi dalam halaman tertentu.

Upaya CSS:

div.class1 {
    font: normal 12px arial, helvetica, sans-serif;
    font-color: #f30;
}
div.class1 div.class2 {
    border: 1px solid #f30;
}

Upaya KURANG:

@red: #f30;
@font-family: arial, helvetica, sans-serif;
div.class1 {
    font: normal 12px @font-family;
    font-color: @red;
    div.class2 {
        border: 1px solid @red;
    }

Versi CSS dapat menyebabkan bug, karena memaksa Anda untuk mengulangi #f30& div.class2setiap kali Anda mencoba untuk mencapai hierarki dan penggunaan ulang variabel.

Pertanyaan saya:

  • Mengapa CSS menyulitkan?
  • KURANG tidak melakukan sesuatu yang istimewa - hanya membuat perbaikan yang jelas dan diterjemahkan ke CSS?
  • Apa yang CSS ingin memotivasi pengguna karena yang mempromosikan gaya pengkodean yang berlebihan?

Saya sangat percaya CSS harus menjadi KURANG. Jelas saya mengabaikan beberapa keuntungan yang jelas mengapa hal-hal dilakukan seperti itu di CSS. Saya pikir itu adalah masalah warisan, tetapi saya terkejut ketika saya melihat tidak ada upaya untuk menyelesaikan ini dengan CSS3.

Tolong bantu saya memahami bagaimana saya harus mendekati CSS?

Jawaban:


15

CSS tidak mencoba untuk membuat hal-hal lebih sulit dengan sengaja, ia dirancang dengan tujuan yang jauh lebih sederhana dalam pikiran, variabel dan hierarki bukanlah satu-satunya kekurangan. KURANG dan Sass ada secara khusus untuk mengatasi kekurangan-kekurangan ini, dan sampai kemampuan mana pun didukung secara asli, Anda harus tetap menggunakannya.

Yang mengatakan, Kelompok Kerja CSS W3C sedang mengerjakan draft untuk variabel CSS dan hierarki CSS:

Sama sekali tidak ada cara untuk mengetahui kapan draft akan siap untuk implementasi, atau seberapa cepat browser besar akan mengadopsinya. Yang bisa saya katakan adalah bahwa konsep Variabel CSS lebih dekat untuk diadopsi, Anda sudah dapat menguji variabel drive CSS di Chrome, Safari dan Firefox, tetapi perlu diingat bahwa dukungan di ketiga browser dianggap eksperimental dan dapat berubah. Baca Menggunakan variabel CSS pada MDN untuk detail lebih lanjut.


1
Jawaban yang bagus, saya pikir saya kehilangan sesuatu yang sangat jelas. :)
Yugal Jindle

1
@YugalJindle Lihatlah dev.w3.org/csswg untuk semua yang sedang dikerjakan Kelompok Kerja CSS - beberapa hal yang cukup menarik di sana.
yannis
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.