CSS-seçici ve biçimlendirme html-belgede rolü

Web sitesi oluşturma ve web sayfasının belirli unsurları ile doldurarak, herkes CSS-seçici olarak bir terim karşıya gelecek. Bu daha doğru sayfadaki tasarımı ve konumu html-dosyanın tüm unsurları belirlemek için hizmet vermektedir. renk, boyut, konum ve diğer: Bunu yapmak için, belirli seçicileri ve bunların biçimlendirme seçeneklerini ayrıntılarıyla CSS-bir belge oluşturun. Her web tasarımcısı biliyor ve düzgün istenilen seçimleri girmek gerekir. Bunlar, türüne göre aşağıda tartışmak hangi main ayrılır.

CSS içinde seçicileri türleri

hangi eleman html biçimli uygulandığı bağlı olarak, CSS-seçici aşağıdaki gruplardan birine ilişkin olabilir:

• Etiket seçici;
• sınıf seçici;
• id-selektör;
• seçiciyi bağlıyor.

Etiket seçici

Aynı zamanda en basit ve yaygın olduğu, "tip seçici" veya "eleman" olarak adlandırılır. Onun CSS-belge olarak biz tarif html dosyası unsurları, isimleri. Biz paragraf stilini ayarlamak gerekiyorsa Örneğin, biz özellikleri ve eleman p {background kendi değerlerini belirtin: x; Renk y; boyutu: z}. Bu durumda, web sayfasının tüm paragraflar aynı formata sahip olacaktır (arka plan rengini, metin boyutunu ve böyle devam eder. D.).

sınıf seçicisi

Ve her paragraf diğer stilleri farklı olduğu gerekiyorsa ne sormak? Bunu yapmak için, bir sınıf seçici yoktur.

p.first {color: bu durumda CSS-belge aşağıdaki formu bir girdi içerecektir x; yazı tipi boyutu: y}. Böylece, "renk" ve sadece birinci sınıf paragraf için "büyüklük" özelliklerini tanımlar.

Bu durumda bir html-belgede ilk stil adının class özelliği girdi. Sınıflar bir web sayfası elemanları uygulamak istediğiniz stili kadar olabilir.

Seçici kimliği

Genellikle sayfanın herhangi bir elemana örneğin daha doğru bir stil tanımlamak için ya onları örnek bir ihtiyaç vardır. Bu durumda, yardım id-seçici geliyor. html dosyası diğerleri arasında kendisini tanımlayan istenen öğe adı atamak. Örneğin, diğer tarzından farklı ayarlamak istediğiniz öğeleri makale başlığı olacaktır.

Daha sonra bir html belgede başlık H1 tanımlayıcısını, örneğin ArticleName atama. #articlename {renk: Ve CSS-dosyasında, kimlik adı ızgara ekleyerek Stili belirtmek mavi; text-align: center}. Şimdi bizim başlık rengi mavi ve ortalanmış olacaktır.

Yukarıdaki türlerinin her biri "basit bir CSS-seçicinin" olarak tarif edilebilir. Bunlar html belgenin belirli bir parametre için Biçimlemeyi: birbirine benzer elemanlar (yazının örneğin tüm paragraflar), bir sınıf (örneğin, yalnızca ilk paragraf) veya belirli bir madde (örneğin, ürün adı).

seçiciler özellik

Uygulama stilleri daha karmaşık yöntemi - Yukarıdaki ek olarak, CSS-seçiciler niteliklerini yoktur. Seçilen nitelik veya değeri html biçim elementleri sağlar. Bu seçicinin birçok çeşidi vardır:

• öznitelik varlığıyla;
• onun tam değerde;
• kısmi öznitelik değeri;
• spesifik değerine.

Bize bu türlerin her düşünelim:

1. İlk vaka. Biçimlendirme, belirli bir özellik html kodunda mevcut olduğu takdirde (bir s, div başlık vs olabilir) uygulanır. Değilse, bu tarzın tüm unsurları için genel kullanır. Örneğin, başlık sahip olan elemanlar için (araç uç).
2. İkinci vaka. tarzı sadece özellik değerlerinin tam bir eşleşme var html-elemanları için de geçerlidir. Örneğin, type özelliğinin değeri göndermek eşittir girdi elemanları vs..
3. Üçüncü vaka. biçiminde altında belli bir kelime var değerler listesinde öğeleri kapsayacak. Örneğin, elementler div sideBar niteliği "sınıfı".
4. Dördüncü vaka. Stil sadece belirli özellik, belirli bir değere sahip html belge, bu elemanlar için tanımlandığı gibidir, ve onun ile başlar. Örneğin, tüm öğelere belirtilen renk kullanımı hangi İngilizce dil niteliği (tr, en-rus, en-au ve t. D. olabilir).

Böylece, bir veya diğer, CSS seçici kullanarak, en iyi bütün bir web sayfası olarak belirtilir ve bazı elementlerini tanımlamak edilebilir.