Apakah itu css3, less, sass

Mar 17, 2022 pm 06:08 PM
css3 less sass

css3 ialah versi teknologi CSS yang dipertingkatkan, bahasa komputer yang digunakan untuk menyatakan gaya fail seperti HTML atau XML Less ialah sambungan CSS dan bahasa helaian gaya dinamik, bahasa prapemproses CSS; ditulis dalam Ruby yang boleh digunakan untuk menerangkan gaya fail dengan jelas dan berstruktur.

Apakah itu css3, less, sass

Persekitaran pengendalian tutorial ini: sistem Windows 7, CSS3&&Sass versi 3.7.4, komputer Dell G3.

Apakah itu CSS3?

CSS ialah singkatan dari Cascading Style Sheets Ia adalah aplikasi yang digunakan untuk menyatakan HTML (Bahasa Penanda Umum Standard) atau XML (Bahasa Penanda Umum Standard) dan fail lain -gaya bahasa komputer.

CSS boleh melaksanakan kawalan tepat tahap piksel ke atas susun atur kedudukan elemen dalam halaman web, menyokong hampir semua saiz dan gaya fon serta mempunyai keupayaan untuk mengedit objek halaman web dan gaya model.

CSS3 ialah versi teknologi CSS (Cascading Style Sheet) yang dinaik taraf. Ia telah dirumuskan pada tahun 1999. Pada 23 Mei 2001, W3C telah melengkapkan draf kerja CSS3, yang terutamanya merangkumi model kotak, modul senarai dan hiperpautan. kaedah , modul bahasa, latar belakang dan sempadan, kesan teks, susun atur berbilang lajur dan modul lain.

Perubahan besar dalam evolusi CSS ialah keputusan W3C untuk memecahkan CSS3 kepada satu siri modul. Vendor penyemak imbas membuat inovasi dengan pantas mengikut kadar CSS, jadi dengan menggunakan pendekatan modul, elemen dalam spesifikasi CSS3 boleh bergerak ke hadapan pada kelajuan yang berbeza kerana vendor penyemak imbas yang berbeza hanya menyokong ciri yang diberikan. Tetapi pelayar yang berbeza menyokong ciri yang berbeza pada masa yang berbeza, yang juga merumitkan pembangunan merentas pelayar.

Prinsip CSS3 adalah sama seperti CSS Ia adalah untuk menyesuaikan pemilih helaian gaya dalam halaman web, dan kemudian merujuk pemilih ini dalam kuantiti yang banyak dalam halaman web.

Ciri baharu

Terdapat banyak ciri baharu CSS3, seperti kesan sudut bulat, sempadan grafik, bayang blok dan bayang teks, menggunakan RGBA untuk mencapai kesan ketelusan, dan kecerunan Kesan, gunakan @Font-Face untuk mencapai fon tersuai, berbilang imej latar belakang, pemprosesan ubah bentuk teks atau imej (putaran, penskalaan, senget, pergerakan), reka letak berbilang lajur, pertanyaan media, dsb.

Apa yang Kurang?

Less ialah sambungan CSS dan bahasa helaian gaya dinamik, prapemproses CSS yang boleh dijalankan pada sisi klien atau pelayan, membantu kami menyesuaikan, mengurus dan menggunakan semula gaya permukaan halaman web.

Less ialah bahasa sumber terbuka yang juga serasi merentas penyemak imbas.

Kelebihan:

1. Less ialah prapemproses CSS. Selepas penyusunan, ia menjana CSS mudah, sesuai untuk pelayar.

2. Kurang menyokong keserasian merentas pelayar.

3 Oleh kerana Kurang menggunakan sarang, kod itu lebih pendek, lebih bersih dan teratur dengan cara tertentu

4. Oleh kerana Kurang menggunakan pembolehubah, penyelenggaraan boleh dicapai dengan lebih cepat.

5. Less menyediakan satu siri pengendali untuk menjadikan pengekodan lebih pantas dan lebih menjimatkan masa.

6. Less menyediakan peraturan @mport supaya kami boleh memproses fail luaran dengan mudah. NOTA: Mengimport diperlukan kerana ramai orang memisahkan helaian gaya mereka kepada berbilang fail dan bukannya memasukkannya ke dalam satu fail.

7. Kurang menyediakan atribut gabungan. Ciri Less yang paling menarik ialah menerima berbilang nilai seperti transformasi, peralihan dan bayangan kotak.

8. Kurang ditulis dalam JavaScript, yang menyusun lebih cepat daripada prapemproses lain untuk CSS.

Kelemahan:

1 Jika kita tidak biasa dengan prapemprosesan CSS, kita mesti meluangkan sedikit masa untuk mempelajari pengetahuan yang berkaitan tentang Less.

2. Kurang menyediakan rangka kerja yang lebih sedikit berbanding dengan prapemproses lama seperti SASS yang merangkumi rangka kerja seperti Kompas, Graviti dan Susy.

3. Dalam Kurang, terdapat gandingan yang ketat antara modul, jadi memerlukan lebih banyak usaha untuk menggunakan semula dan/atau menguji modul berkaitan.

Apakah sass?

Sass ialah bahasa meta yang lebih tinggi daripada CSS Ia boleh digunakan untuk menerangkan gaya fail dengan jelas dan berstruktur, serta mempunyai fungsi yang lebih berkuasa daripada CSS biasa. Sass menawarkan sintaks yang lebih bersih, lebih elegan sambil menyediakan ciri untuk mencipta helaian gaya yang boleh diselenggara dan terurus.

Sass ialah bahasa prapemprosesan CSS yang ditulis dalam bahasa Ruby Ia dilahirkan pada tahun 2007 dan merupakan bahasa prapemprosesan CSS matang terbesar. Ia pada asalnya direka bentuk untuk berfungsi dengan HAML (precompiler HTML inden), jadi ia mempunyai gaya lekukan yang sama seperti HTML. SASS ialah lanjutan CSS3 yang menambahkan sarang peraturan, pembolehubah, campuran, warisan pemilih dan banyak lagi. Tukarkannya kepada kod CSS standard yang dibentuk dengan baik dengan menggunakan alat baris arahan atau pemalam rangka kerja WEB.

(Mempelajari perkongsian video: tutorial video css, bahagian hadapan web)

Atas ialah kandungan terperinci Apakah itu css3, less, sass. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

AI Hentai Generator

AI Hentai Generator

Menjana ai hentai secara percuma.

Artikel Panas

R.E.P.O. Kristal tenaga dijelaskan dan apa yang mereka lakukan (kristal kuning)
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Tetapan grafik terbaik
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Cara Memperbaiki Audio Jika anda tidak dapat mendengar sesiapa
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Cara Membuka Segala -galanya Di Myrise
4 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Bagaimana untuk mencapai kesan gelombang dengan CSS3 tulen? (contoh kod) Bagaimana untuk mencapai kesan gelombang dengan CSS3 tulen? (contoh kod) Jun 28, 2022 pm 01:39 PM

Bagaimana untuk mencapai kesan gelombang dengan CSS3 tulen? Artikel ini akan memperkenalkan kepada anda cara menggunakan animasi SVG dan CSS untuk mencipta kesan gelombang Saya harap ia akan membantu anda!

Gunakan CSS dengan mahir untuk merealisasikan pelbagai butang berbentuk pelik (dengan kod) Gunakan CSS dengan mahir untuk merealisasikan pelbagai butang berbentuk pelik (dengan kod) Jul 19, 2022 am 11:28 AM

Artikel ini akan menunjukkan kepada anda cara menggunakan CSS untuk melaksanakan pelbagai butang berbentuk pelik yang kerap muncul. Saya harap ia akan membantu anda!

Bagaimana untuk menyembunyikan elemen dalam css tanpa mengambil ruang Bagaimana untuk menyembunyikan elemen dalam css tanpa mengambil ruang Jun 01, 2022 pm 07:15 PM

Dua kaedah: 1. Menggunakan atribut paparan, cuma tambah gaya "display:none;" pada elemen. 2. Gunakan kedudukan dan atribut teratas untuk menetapkan kedudukan mutlak elemen untuk menyembunyikan elemen. Cuma tambahkan gaya "position:absolute;top:-9999px;".

Bagaimana untuk melaksanakan sempadan renda dalam css3 Bagaimana untuk melaksanakan sempadan renda dalam css3 Sep 16, 2022 pm 07:11 PM

Dalam CSS, anda boleh menggunakan atribut imej sempadan untuk mencapai sempadan renda. Atribut imej sempadan boleh menggunakan imej untuk membuat sempadan, iaitu, menambah imej latar belakang ke sempadan Anda hanya perlu menentukan imej latar belakang sebagai gaya renda; lebar sempadan imej ke dalam. Sama ada permulaan diulang;".

Apakah maksud perisian sass? Apakah maksud perisian sass? Aug 15, 2022 am 11:39 AM

Nama penuh SASS ialah "Perisian sebagai perkhidmatan", yang bermaksud "perisian sebagai perkhidmatan" ia ialah model penggunaan perisian di mana pembekal pihak ketiga membina aplikasi pada infrastruktur awan dan menyediakannya kepada pelanggan melalui Internet dalam bentuk; langganan aplikasi yang tidak memerlukan pelanggan membina infrastruktur asas di hadapan. Ini bermakna perisian itu boleh diakses pada mana-mana peranti dengan sambungan internet dan pelayar web, tidak seperti perisian tradisional yang hanya boleh dipasang pada mesin tempatan anda.

Ternyata karusel teks dan karusel imej juga boleh direalisasikan menggunakan CSS tulen! Ternyata karusel teks dan karusel imej juga boleh direalisasikan menggunakan CSS tulen! Jun 10, 2022 pm 01:00 PM

Bagaimana untuk mencipta karusel teks dan karusel imej? Perkara pertama yang semua orang fikirkan ialah sama ada untuk menggunakan js Malah, karusel teks dan karusel imej juga boleh direalisasikan menggunakan CSS tulen. Saya harap ia akan membantu semua orang.

Bagaimana untuk membesarkan imej dengan mengklik tetikus dalam css3 Bagaimana untuk membesarkan imej dengan mengklik tetikus dalam css3 Apr 25, 2022 pm 04:52 PM

Kaedah pelaksanaan: 1. Gunakan pemilih ":aktif" untuk memilih keadaan klik tetikus pada gambar 2. Gunakan atribut transform dan fungsi skala() untuk mencapai kesan pembesaran gambar, sintaks "img:active {transform; : skala(pembesaran paksi-x, y Pembesaran paksi);}".

Adakah kesan animasi css3 mempunyai ubah bentuk? Adakah kesan animasi css3 mempunyai ubah bentuk? Apr 28, 2022 pm 02:20 PM

Kesan animasi dalam css3 mempunyai ubah bentuk; anda boleh menggunakan "animasi: atribut animasi @keyframes ..{..{transform: transformation attribute}}" untuk mencapai kesan animasi ubah bentuk Atribut animasi digunakan untuk menetapkan gaya animasi, dan atribut transform digunakan untuk menetapkan gaya ubah bentuk.

See all articles