CSS yorumu nasıl yazılır
Bir CSS yorumu /* ile başlar ve */ ile biter. Aradaki her şey, ister bir satır ister yirmi satır olsun, tarayıcı tarafından yok sayılır.
Yalnızca bu tek söz dizimi var. CSS'te ayrı bir tek satırlık yorum yoktur.
Yorumlar nereye yazılabilir
Bir yorum boşluğa izin verilen her yerde durabilir: kurallar arasında, bildirimler arasında, bir değerden sonra, bir seçici listesinin içinde. Bir .css dosyasında, bir <style> elementinde ve bir style özniteliğinde aynı şekilde çalışır.
/* Buttons */
.btn, /* default */
.btn-primary { /* variant */
padding: 8px 14px; /* 8px top and bottom, 14px sides */
}
<p style="color: #16a34a; /* inline comments work too */">Hello</p>
HTML yorumları, <!-- ... -->, CSS için değil işaretleme içindir. İki söz dizimi HTML yorumları sayfasında yan yana anlatılıyor.
Kodu yoruma almak
Yorumların gündelik kullanımı, bir bildirimi silmeden kapatıp ne işe yaradığını görmektir. Onu /* */ içine al:
Border satırının etrafındaki /* ve */ işaretlerini sil, kehribar rengi kenarlık görünür. Bütün bir kuralı yoruma almak da aynıdır: seçiciden önce /*, kapanan süslü parantezden sonra */ koy.
Çoğu editör bunu senin yerine açıp kapatır: satırları seç ve Ctrl + / tuşlarına bas (macOS'ta Cmd + /).
// neden CSS'ini bozar
// bir yoruma benzer, çünkü JavaScript, Sass ve Less'te yorumdur. CSS'te ise sadece iki karakterdir ve ardından ne geliyorsa onun parçası olur. Tarayıcı bu durumda geçersiz bir seçici görür ve bir sonraki kuralın tamamını hiçbir hata mesajı vermeden atar.
Tarayıcı // this is NOT a comment .one ifadesini tek bir seçici olarak okudu; bu geçersiz olduğu için .one kuralının tamamı atıldı. Satırı /* this is a comment */ olarak değiştir, yeşil arka plan geri gelir.
Yorumlar iç içe yazılamaz
Bir yorum ilk */ ile biter. İçinde zaten yorum olan kodu sarmak, dıştaki yorumunu erkenden bitirir:
İçinde yorum olan bir bloğu yoruma almak için önce içtekileri sil ya da kısalt.
Stil dosyasını yorumlarla düzenlemek
Uzun stil dosyaları bölüm başlıklarıyla daha kolay okunur. Yaygın bir gelenek:
/* ==========================================
Layout
========================================== */
.page { max-width: 960px; margin: 0 auto; }
/* ------------------------------------------
Header
------------------------------------------ */
.header { padding: 16px; }
/*! License: MIT (many minifiers keep comments that start with "!") */
Yorumlar dosyanın parçası olarak her ziyaretçiye gönderilir ve View Source'ta görünür, bu yüzden oraya asla şifre, iç URL'ler ya da yayınlamayacağın notlar koyma.
Sık yapılan hatalar
//kullanmak. Bir sonraki kuralı sessizce siler./* */kullan.- Yorumları iç içe yazmak. İlk
*/yorumu bitirir; geri kalanı bir sonraki kuralı bozar. - Kapanış
*/işaretini unutmak./*işaretinden sonraki her şey, stil dosyasının sonuna kadar yorum olur. - CSS içinde
<!-- -->kullanmak. Bu HTML yorum söz dizimidir ve CSS'i yoruma almaz. - Yorumlarda gizli bilgi bırakmak. Stil dosyasıyla birlikte tarayıcıya gider.
Sıkça Sorulan Sorular
CSS'te yorum nasıl yazılır?
Metni /* ve */ arasına al: /* This is a comment */. Aynı söz dizimi tek satır için de çok satır için de, stil dosyasında boşluğa izin verilen her yerde çalışır.
CSS'te yorum için // kullanılabilir mi?
Hayır. CSS'te tek satırlık yorum yoktur. // bir sonraki seçicinin ya da bildirimin parçası olarak okunur, bu da onu geçersiz kılar ve tarayıcı o kuralın ya da bildirimin tamamını atar. Sass, Less ve benzeri önişlemciler // kabul eder, düz CSS etmez.
CSS yorumları iç içe yazılabilir mi?
Hayır. Bir yorum ilk */ ile biter, yani /* a /* b */ c */ b'den sonra biter ve geriye kalan c */ bir sonraki kuralı bozan çöpe dönüşür.
CSS'te yorum kısayolu nedir?
VS Code dahil çoğu kod editöründe Windows ve Linux'ta Ctrl + /, macOS'ta Cmd + / seçili satırları /* */ içine alır; tekrar basınca yorum kalkar.
CSS yorumları performansı etkiler mi?
Yalnızca dosyaya bayt ekleyerek. Tarayıcı onları ayrıştırırken atar. Derleme araçları stil dosyalarını küçültür ve yorumları siler; çoğu, lisans notları için gelenek olan /*! ile başlayan yorumları korur.
