CSS'yi HTML 5'e gömün - işte böyle yapılır
HTML 5'e CSS'yi kolayca entegre edebilirsiniz. HTML ve XML belgelerinizi grafik olarak daha çekici hale getirmek istiyorsanız, Basamaklı Stil Sayfaları (CSS) iyi bir seçimdir. Biçimlendirme dili, web sitelerinizi görsel olarak geliştirmek için çok sayıda seçenek sunar. Temel olarak CSS'yi HTML 5'e entegre etmenin üç farklı yolu vardır. Bunu size bu pratik ipucunda göstereceğiz.
HTML 5'te CSS: Seçenek 1 - CSS dosyasını dış kaynak
İlk seçenek CSS'yi ayrı bir dosyaya taşımaktır. Bu sayısız avantajlar sunar: Stil sayfaları yalnızca tek bir sayfayı etkilemez, aynı zamanda her HTML5 sayfasında otomatik olarak kullanılır. Ana avantaj merkezi yönetimdir. Değişiklikleri hızlı bir şekilde tüm sayfalara uygulayabilirsiniz. HTML 5'e bir CSS dosyası nasıl eklenir:
- Yeni bir CSS dosyası oluşturun.
- Kafa alanında, CSS dosyanıza bakın. Bu durumda, dosya style.css olarak adlandırıldı - ancak adlandırma elbette bireyseldir:
- Style.css dosyasını web sunucusunun ana dizinine kaydetmelisiniz.
- CSS dosyanızı HTML 5'e başarıyla entegre ettiniz.
HTML 5 dosyanızın başındaki CSS
Dış kaynaklı bir CSS dosyası oluşturmak istemiyorsanız, HTML 5 belgenizin başlığında CSS özelliklerini de ayarlayabilirsiniz. Bunlar daha sonra tüm HTML 5 sayfaları için değil, yalnızca bu HTML 5 dosyasını etkiler.
- HTML 5 belgenizi açın
- Kafa alanına aşağıdaki komutu ekleyin:
- Şimdi istenen özellikleri tanımlayın: Bu, örneğin başlıkların boyutu, metnin rengi, vb. Olabilir. Bilinen CSS komutlarını kullanın.
- İle özellikleri girdikten sonra komutu kapatın.
- Belirtilen özellikler bu HTML 5 belgesi için kabul edildi.
CSS satır içi stili: komutları doğrudan kullanın
CSS'yi HTML 5'e entegre etmenin son yolu satır içi stilidir. Bu, komutlarınızı doğrudan kaynak koduna girdiğiniz anlamına gelir.
- Grafik görüntüsünü değiştirmek istediğiniz noktaya gidin.
- CSS komutlarını doğrudan girin. Örneğin, bu şöyle görünebilir:
Mavi bir alt pozisyon
- Özellik yalnızca bu komut için kullanılır.