CSS neden sahte öğelerle çalışıyor?

Sınıfımda oynuyordum ve CSS'nin makyaj öğeleriyle çalıştığını öğrendim.

Misal:

imsocool {
    color:blue;
}

<imsocool>HELLO</imsocool>

Profesörüm bunu ilk kez kullandığımda gördüğünde, makyaj elemanlarının işe yaradığından biraz şaşırdı ve tüm makyaj elemanlarını kimliğe sahip paragraflara değiştirmemi tavsiye etti.

Profesörüm neden makyaj elemanları kullanmamı istemiyor? Etkili çalışırlar.

Ayrıca, neden makyaj öğelerinin var olduğunu ve CSS ile çalıştığını bilmiyordu. Bunlar nadir mi?

CSS neden sahte öğelerle çalışıyor?

(Çoğu) tarayıcılar, gelecekteki HTML eklemeleriyle (bir dereceye kadar) ileri uyumlu olacak şekilde tasarlanmıştır. Tanınmayan öğeler DOM'da ayrıştırılır, ancak bunlarla ilişkili anlambilim veya özel varsayılan oluşturma yoktur.

Spesifikasyona yeni bir öğe eklendiğinde, bazen eski tarayıcılarda aynı işlevselliği sağlamak için CSS, JavaScript ve ARIA kullanılabilir (ve bu işlevselliği eklemek için bu dillerin değiştirilebilmesi için öğelerin DOM'da görünmesi gerekir. ).

( HTML'yi özel öğelerle genişletmek için bir araç tanımlamak için çalışmanın devam ettiği belirtilmelidir , ancak bu çalışma şu anda geliştirmenin erken aşamalarındadır, bu nedenle olgunlaşana kadar muhtemelen kaçınılmalıdır.)

Profesörüm neden makyaj elemanları kullanmamı istemiyor?

• HTML spesifikasyonu tarafından izin verilmiyor
• Aynı ada sahip gelecekteki standart öğelerle çakışabilirler
• Muhtemelen göreve daha uygun olan bir HTML öğesi var

Ayrıca; neden makyaj öğelerinin var olduğunu ve CSS ile çalıştığını bilmiyordu. Bunlar nadir mi?

Evet. İnsanlar bunları kullanmıyor çünkü yukarıdaki sorunları var.

TL; DR

• Özel etiketler HTML'de geçersiz. Bu, oluşturma sorunlarına yol açabilir.
• Kod taşınabilir olmadığından gelecekteki gelişimi zorlaştırır.
• Geçerli HTML, SEO, hız ve profesyonellik gibi birçok avantaj sunar.

Uzun cevap

Özel etiketler içeren kodun daha kullanılabilir olduğu konusunda bazı argümanlar vardır.

Ancak, geçersiz HTML'ye yol açar. Hangi siteniz için iyi değil.

Geçerli CSS / HTML Noktası | StackOverflow

• Google bunu tercih ediyor, bu yüzden SEO için iyi.
• Web sayfanızın test etmediğiniz tarayıcılarda çalışma olasılığını artırır.
• Daha profesyonel görünmenizi sağlar (en azından bazı geliştiricilere)
• Uyumlu tarayıcılar [geçerli HTML'yi daha hızlı] görüntüleyebilir
• Muhtemelen kaçırmış olduğunuz, muhtemelen test etmediğiniz şeyleri etkileyen, örneğin sayfanın kod sayfası veya dil kümesi gibi bir dizi belirsiz hatayı işaret eder.

Neden Doğrulanmalı | W3C

• Hata ayıklama aracı olarak doğrulama
• Geleceğe dönük kalite kontrolü olarak doğrulama
• Doğrulama bakımı kolaylaştırır
• Doğrulama iyi uygulamaların öğretilmesine yardımcı olur
• Doğrulama profesyonellik belirtisidir

YADA (başka bir (farklı) cevap)

Edit: Tip vs tag vs element ile ilgili olarak aşağıdaki BoltClock açıklamasına bakınız. Genellikle anlambilim konusunda endişelenmem ama yorumu çok uygun ve bilgilendiricidir.

Zaten bir sürü iyi yanıt olmasına rağmen, profesörünüzün sizden bu soruyu göndermenizi istediğini söylediniz, böylece okulda (resmi olarak) sizsiniz . Sadece CSS değil, aynı zamanda web tarayıcılarının mekaniği hakkında biraz daha derinlemesine bilgi vereceğimi düşündüm . Göre Wikipedia , "CSS açıklamak için kullanılan bir stil dil ... yazılan bir belgedir bir işaretleme dili." ("A" üzerine vurgu ekledim) "HTML ile yazılmış" ifadesinin HTML'nin belirli bir sürümünden çok daha az olduğunu unutmayın. CSS vb Tabii HTML, XHTML, XML, SGML, XAML, üzerinde kullanılabilir, olur şey lazım kılmakbu belge türlerinin her biri de stil uygular. Tanım gereği, CSS belirli biçimlendirme dili etiketlerini bilmiyor / anlamıyor / önemsemiyor. Dolayısıyla, HTML ile ilgili olarak etiketler "geçersiz" olabilir, ancak CSS'de "geçerli" bir etiket / öğe / tür kavramı yoktur.

Modern görsel tarayıcılar yekpare programlar değildir. Bunlar, belirli işleri olan farklı "motorların" bir birleşimidir. En azından 3 motoru, render motorunu, CSS motorunu ve javascript motorunu / VM'yi düşünebilirim. Ayrıştırıcının oluşturma motorunun bir parçası olup olmadığından (veya tam tersi) veya ayrı bir motor olup olmadığından emin değilsiniz, ancak fikri anlıyorsunuz.

Olsun ya da olmasın bir görsel tarayıcı ( Diğerleri zaten ekran gerçeğini ele sahip okuyucular geçersiz etiketleri ile uğraşan diğer zorlukları olabilir ) biçimlendirme belgede ve ayrıştırıcı yaprakları olsun "geçersiz" etiketi bağlıdır uygular sonra render motoru stilleri geçerli olup bu etikete ekleyin. O daha zor / geliştirmek korumak için yapacak beri, CSS motorları için yazılmaz anlamaya o "Bu işte bir HTML belgesi geçerli etiketleri / elementler / tiplerinin listesi olmasıdır." CSS motorları sadece etiketleri / elemanları / türleri bulur ve ardından oluşturma motoruna "İşte uygulamanız gereken stiller." Render motorunun stilleri gerçekte uygulamaya karar verip vermeyeceği budur.

Motordan motora temel akışı düşünmenin kolay bir yolu : ayrıştırıcı -> CSS -> render. Gerçekte çok daha kıvrımlıdır, ancak bu yeni başlayanlar için yeterince iyidir.

Bu cevap zaten çok uzun, bu yüzden orada bitireceğim.

Bilinmeyen öğelere divmodern tarayıcılar tarafından muamele edilir . Bu yüzden çalışıyorlar. Bu, yeni öğelerin eklenebileceği modüler bir yapı sunan yaklaşan HTML5 standardının bir parçasıdır.

Eski tarayıcılarda (sanırım IE7-) bir Javascript-hile uygulayabilir ve daha sonra da çalışacaklardır.

İşte bir örnek ararken bulduğum ilgili bir soru .

Javascript düzeltmesi ile ilgili bir soru . Aslında bu öğeleri kutudan çıkarmayan IE7 olduğu ortaya çıkıyor.

Ayrıca; neden tamamlanmış etiketlerin var olduğunu ve CSS ile çalıştığını bilmiyordu. Bunlar nadir mi?

Evet, oldukça. Ama özellikle: ek bir amaca hizmet etmiyorlar. Ve html5 için yenidir. HTML'nin önceki sürümlerinde bilinmeyen bir etiket geçersizdi.

Ayrıca, öğretmenlerin bazen bilgilerinde boşluklar olduğu görülmektedir. Bu, öğrencilere belirli bir konuyla ilgili temel bilgileri öğretmeleri gerektiğinden kaynaklanabilir ve tüm giriş ve çıkışları bilmek ve gerçekten güncel olmak gerçekten işe yaramaz. Bir zamanlar gözaltına playalındım çünkü öğretmen bir virüsü programladığımı düşündü, çünkü GWBasic'teki komutu kullanarak bir bilgisayarın müzik çalmasını sağlayabildiğim için. (Gerçek hikaye ve evet, uzun zaman önce). Ancak sebebi ne olursa olsun, custome unsurlarını kullanmama tavsiyesinin sağlam olduğunu düşünüyorum.

Aslında özel öğeleri kullanabilirsiniz. İşte bu konuda W3C spesifikasyonu:

http://w3c.github.io/webcomponents/spec/custom/

Ve bunların nasıl kullanılacağını açıklayan bir eğitici:

http://www.html5rocks.com/en/tutorials/webcomponents/customelements/

@Quentin tarafından işaret edildiği gibi: bu, geliştirmenin ilk günlerinde bir taslak şartname ve öğe adlarının ne olabileceğine dair kısıtlamalar getirmesidir.

Diğer cevaplar hakkında ya sadece yanlış yazılmış ya da belki biraz yanlış olan birkaç şey vardır.

YANLIŞ (ish): Standart olmayan HTML öğelerine "izin verilmez", "geçersiz" veya "geçersiz".

Şart değil. Onlar "uygun değil" . Fark ne? Bir şey "uygun değil" ve yine de "izin verilebilir". W3C, HTML polisini evinize göndermeyecek ve sizi götürmeyecektir.

W3C bir sebepten ötürü işleri bu şekilde bıraktı. Uyumluluk ve teknik özellikler bir topluluk tarafından tanımlanır. Daha spesifik amaçlar için HTML tüketen daha küçük bir topluluğunuz varsa ve hepsi işleri kolaylaştırmak için ihtiyaç duydukları bazı yeni Öğeler üzerinde anlaşırsa, W3C'nin "diğer geçerli spesifikasyonlar" olarak ifade ettiği şeye sahip olabilirler . (bu basitleştirme üzerinde bir brüt, tabii ki, ama fikri anladınız)

Bununla birlikte, katı doğrulayıcılar standart dışı öğelerinizi "geçersiz" olarak ilan edeceklerdir. ancak bunun nedeni, doğrulayıcının işi, tarayıcı için veya kullanım için "yasallık" sağlamak değil, doğruladığı özelliklere uygunluğu sağlamaktır .

YANLIŞ (imsi): Standart dışı HTML öğeleri olacaktır oluşturma sorunlarından neden

Muhtemelen, ama olası değil. ("will" ifadesini "might" ile değiştirin) Bunun bir oluşturma sorunuyla sonuçlanmasının tek yolu, özel öğenizin HTML spesifikasyonundaki bir değişiklik veya aynı sistem içinde onurlandırılan başka bir spesifikasyon (örneğin, SVG, Math veya özel bir şey).

Aslında, CSS'nin standart olmayan etiketleri biçimlendirebilmesinin nedeni, HTML spesifikasyonunun açıkça şunu belirtmesidir:

Kullanıcı aracıları anlamsal olarak nötr olarak anlamadıkları öğelere ve niteliklere davranmalıdır; bunları DOM'da bırakma (DOM işlemcileri için) ve CSS'ye (CSS işlemcileri için) göre şekillendirme, ancak bunlardan herhangi bir anlam çıkarmama

Not: Özel bir etiket kullanmak istiyorsanız, HTML spesifikasyonunda daha sonra bir değişikliğin stilinizi havaya uçurabileceğini unutmayın, bu yüzden hazırlıklı olun. Ancak W3C'nin <imsocool>etiketi uygulaması pek olası değildir .

Standart olmayan etiketler ve JavaScript (DOM aracılığıyla)

JavaScript kullanarak özel öğelere erişmenin ve değiştirmenin nedeni, spesifikasyonun DOM'da nasıl ele alınması gerektiği hakkında konuşmasıdır , bu da sayfanızdaki öğeleri değiştirmenizi sağlayan (gerçekten korkunç) API'dir.

HTMLUnknownElement arabirimi, bu belirtim (veya diğer geçerli belirtimler) tarafından tanımlanmayan HTML öğeleri için kullanılmalıdır.

TL; DR: Spesifikasyona uygunluk, iletişim ve güvenlik amacıyla yapılır. Tek amacı uygunluğu uygulamak olan ancak kullanımı isteğe bağlı olan bir validator dışında her şeye uyulmamaya hala izin verilmektedir .

Örneğin:

var wee = document.createElement('wee');
console.log(wee.toString()); //[object HTMLUnknownElement]

(Eminim bu alevler çekecektir, ama benim 2 sentim var)

Özelliklere göre:

CSS

Bir tür seçici CSS nitelikli isimlerin sözdizimi kullanılarak yazılmış bir belge dili eleman türünün adıdır

Bunun eleman seçici olduğunu düşündüm , ama görünüşe göre aslında tip seçici. Spesifikasyon CSS qualified names, isimlerin gerçekte ne olduğu konusunda hiçbir kısıtlama getirmediği hakkında konuşmaya devam ediyor . Yani, tür seçici CSS nitelenmiş ad sözdizimiyle eşleştiği sürece teknik olarak doğru CSS'dir ve belgedeki öğeyle eşleşir. Belirli bir özellikte (HTML veya başka bir şekilde) bulunmayan öğeler üzerinde CSS'ye özgü bir kısıtlama yoktur.

HTML

İstediğiniz belgeye herhangi bir etiket eklenmesi konusunda resmi bir kısıtlama yoktur. Ancak, belgeler diyor ki

Yazarlar, öğelerin, özniteliklerin veya öznitelik değerlerini, amaçlanan semantik amaçları dışındaki amaçlar için kullanmamalıdır; aksi takdirde, yazılım sayfanın doğru işlenmesini engeller.

Ve sonra söylüyor

Yazarlar, bu spesifikasyonun veya diğer ilgili spesifikasyonların izin vermediği elemanları, nitelikleri veya nitelik değerlerini kullanmamalıdır, çünkü bu, gelecekte dilin genişletilmesini önemli ölçüde zorlaştırır.

Özellikle nerede veya spec bilinmeyen öğelere izin verildiğini söylüyor , ancak tanınmayan öğeler için HTMLUnknownElement arabirimi hakkında konuştuğundan emin değilim . Bazı tarayıcılar, geçerli spesifikasyondaki öğeleri bile tanımayabilir (IE8 akla geliyor).

Özel öğeler için bir taslak var , ancak henüz herhangi bir yerde uygulandığından şüpheliyim.

Bu html5 ile mümkündür, ancak eski tarayıcıları dikkate almanız gerekir.

Onları kullanmaya karar verirseniz, html'inizi YORUM YAPINIZ! Bazı insanlar bunun ne olduğunu anlamakta güçlük çekebilir, böylece bir yorum tonlarca zaman kazandırabilir.

Böyle bir şey,

<!-- Custom tags in use, refer to their CSS for aid -->

Kendi özel etiketinizi / öğelerinizi oluşturduğunuzda, eski tarayıcıların nav/ gibi html5 öğeleri gibi bir ipucu olmayacaktır section.

Bu kavramla ilgileniyorsanız, o zaman doğru şekilde yapmanızı tavsiye ederim.

Başlangıç

Özel Öğeler, web geliştiricilerinin yeni HTML öğesi türleri tanımlamasına olanak tanır. Spesifikasyon, Web Bileşenleri şemsiyesi altına giren birkaç yeni API ilkesinden biridir, ancak büyük olasılıkla en önemlisidir. Özel bileşenler tarafından açılan özellikler olmadan Web Bileşenleri mevcut değildir:

Yeni HTML / DOM öğeleri tanımlama Diğer öğelerden genişleyen öğeler oluşturma Özel işlevleri mantıksal olarak tek bir etikette bir araya getirme Mevcut DOM öğelerinin API'sını genişletme

Onunla yapabileceğiniz çok şey var ve bu makale koymaktan hoşlandığı gibi senaryonuzu güzelleştirir. HTML'deki yeni öğeleri tanımlayan Özel Öğeler .

Şimdi özetleyelim,

Artıları

• Çok zarif ve okunması kolay.

• O kadar çok görmek güzel divs. : p

• Koda benzersiz bir his verir

Eksileri

• Eski tarayıcı desteği, göz önünde bulundurulması gereken güçlü bir şeydir.

• Diğer geliştiricilerin özel etiketler hakkında bilmiyorlarsa ne yapmaları gerektiği konusunda hiçbir fikri olmayabilir. (Onlara açıklayın veya bilgilendirmek için yorum ekleyin)

• Son olarak dikkate alınması gereken bir şey var, ancak emin değilim, blok ve satır içi öğeler. Özel etiketleri kullanarak, özel etiketin varsayılan bir tarafı olmayacağı için daha fazla css yazacaksınız.

Seçim tamamen size bağlıdır ve bunu projenin ne istediğine dayandırmalısınız.

Güncelleme 1/2/2014

İşte bulduğumuz ve paylaşacağımı düşündüğüm çok yararlı bir makale, Özel Öğeler .

Neden Özel Öğeler? Özel Öğeler yazarların kendi öğelerini tanımlamasına izin verir. Yazarlar, JavaScript kodunu özel etiket adlarıyla ilişkilendirir ve ardından bu özel etiket adlarını herhangi bir standart etiket gibi kullanırlar.

Örneğin, süper düğme adı verilen özel bir düğmeyi kaydettikten sonra, süper düğmeyi aşağıdaki gibi kullanın:

Özel öğeler hala öğelerdir. Bunları herhangi bir standart veya bugünkü kadar kolay oluşturabilir, kullanabilir, manipüle edebilir ve oluşturabiliriz.

Bu kullanmak için çok iyi bir kütüphane gibi görünüyor ama Window's Build durumunu geçmedi fark ettim. Bu aynı zamanda bir alfa öncesi olduğunu düşünüyorum, bu yüzden gelişirken buna göz kulak olurum.

Neden onları kullanmanı istemiyor? Bunlar ortak veya HTML5 standardının bir parçası değildir. Teknik olarak izin verilmez. Onlar bir kesmek.

Yine de onları kendim beğeniyorum. XHTML5 ile ilgileniyor olabilirsiniz. Kendi etiketlerinizi tanımlamanıza ve bunları standardın bir parçası olarak kullanmanıza olanak tanır.

Ayrıca, diğerlerinin de belirttiği gibi, bunlar geçersizdir ve bu nedenle taşınabilir değildir.

Neden var olduklarını bilmiyordu? Bilmiyorum, ancak bunlar yaygın değil. Muhtemelen yapabileceğinin farkında değildi.

Oluşturulan etiketler neredeyse hiç kullanılmamaktadır, çünkü mevcut her tarayıcıda ve gelecekteki her tarayıcıda güvenilir bir şekilde çalışması olası değildir.

Bir tarayıcının HTML kodunu bildiği öğelere ayrıştırması gerekir, tamamlanmış etiketler belge nesne modeline (DOM) sığacak başka bir şeye dönüştürülür. Web standartları, standartların dışındaki her şeyin nasıl ele alınacağını kapsamadığından, web tarayıcıları standart olmayan kodu farklı şekillerde ele alma eğilimindedir.

Web geliştirme, başka bir belirsizlik unsuru eklemeden, kendi tuhaflıkları olan bir dizi farklı tarayıcıyla yeterince zor. En iyi bahis aslında standartlarda olan şeylerle, tarayıcı satıcılarının takip etmeye çalıştığı şeydir, bu yüzden gerçekten çalışmak için en iyi şansa sahiptir.

Bence makyaj etiketleri kimliğine sahip p'lerden (genel olarak bazı metin blokları) potansiyel olarak daha karmaşık veya belirsizdir. Hepimiz kimliğine sahip bir ap'nin bir paragraf olduğunu biliyoruz, ancak hangi makyaj etiketlerinin amaçlandığını kim bilebilir? En azından bu benim düşüncem. :) Bu nedenle bu, işlevsellikten daha çok bir stil / netlik sorunudur.

Diğerleri mükemmel puanlar verdiler , ancak AngularJS gibi bir çerçeveye bakarsanız, özel öğeler ve nitelikler için çok geçerli bir durum olduğunu belirtmek gerekir . Bunlar sadece xml için daha iyi anlamsal anlam ifade etmekle kalmaz, aynı zamanda web sayfası için davranış, görünüm ve his de sağlayabilir.

CSS, yalnızca (X) HTML belgelerini değil, XML belgelerini sunmak için kullanılabilen bir stil sayfası dilidir. Oluşturulan etiketlere sahip snippet'iniz yasal bir XML belgesinin parçası olabilir; tek bir kök öğeye eklerseniz bir tane olur. Muhtemelen <html> ...</html>etrafınızda zaten var mı? Mevcut herhangi bir tarayıcı XML belgelerini görüntüleyebilir.

Tabii ki çok iyi bir XML belgesi değil, bir dilbilgisi ve bir XML bildirimi yok. Bunun yerine bir HTML bildirim üstbilgisi (ve muhtemelen doğru mime türünü gönderen bir sunucu yapılandırması) kullanırsanız, bunun yerine yasadışı HTML olur.

(X) HTML öğelerinin bir web sayfası sunumu bağlamında yararlı olan anlamsal bir anlamı olduğu için düz XML'e göre avantajları vardır. Araçlar bu semantikle çalışabilir, diğer geliştiriciler anlamı bilir, daha az hataya eğilimlidir ve daha iyi okunur.

Ancak diğer bağlamlarda sunumu yapmak için CSS'yi XML ve / veya XSLT ile kullanmak daha iyidir. Yaptığın şey bu. Bu sizin göreviniz olmadığından, ne yaptığınızı bilmiyordunuz ve HTML / CSS, senaryolarınıza sadık kalmanız için çoğu zaman daha iyi bir yoldur.

Araçların size anlamlı hata mesajları verebilmesi için belgenize bir (X) HTML üstbilgisi eklemelisiniz.

... Yaptığım tüm etiketleri kimliğe sahip paragraflarla değiştiriyorum.

Aslında düzgün bir şekilde nasıl yapılacağına dair önerisiyle ilgili sorun yaşıyorum.

1. Bir <p>etiket paragraflar içindir. İnsanları bir div yerine her zaman kullandığını görüyorum - sadece boşluk amaçları için veya daha nazik göründüğü için. Paragraf değilse, kullanmayın.

2. Özel olarak hedeflemeniz gerekmediği sürece (ör. Javascript ile) kimliklerin her şeye yapıştırılmasına gerek yoktur. Sınıfları veya sadece düz bir div kullanın.

İlk günlerinden itibaren CSS, biçimlendirme agnostik olacak şekilde tasarlanmıştır, böylece DOM yapıları gibi herhangi bir biçimlendirme dili ile kullanılabilir (örneğin SVG). name tokenÜretime uygun tüm etiketler CSS'de mükemmel şekilde geçerlidir. Yani sorunuz CSS'den ziyade HTML ile ilgili.

Özel etiketli öğeler HTML5 spesifikasyonu tarafından desteklenir. HTML5, bilinmeyen öğelerin DOM'da nasıl ayrıştırılacağını standartlaştırır. HTML5, özel öğelerin tam olarak konuşulmasını sağlayan ilk HTML spesifikasyonudur. <!DOCTYPE html>Belgenizde HTML5 dokümanı kullanmanız yeterlidir .

Özel etiket adlarından itibaren ...

Bu belge http://www.w3.org/TR/custom-elements/ en az bir '-' (tire) sembolü içermeyi seçtiğiniz özel etiketleri önerir. Bu şekilde gelecekteki HTML öğeleriyle çakışmazlar. Bu nedenle, dokümanınızı böyle bir şeye değiştirseniz iyi olur:

<style>
so-cool {
    color:blue;
}
</style>

<body>
    <so-cool>HELLO</so-cool>
</body> 

^{Görünüşe göre kimse bundan bahsetmedi, ben de söyleyeceğim.}

Bu, tarayıcı savaşlarının bir yan ürünüdür .

1990'larda internetin yaygınlaşmaya başladığı ilk zamanlarda, tarayıcı pazarında rekabet arttı. Rekabetçi kalmak ve kullanıcıları çekmek için, bazı tarayıcılar (en önemlisi Internet Explorer), sayfa tasarımcılarının ne anlama geldiğini anlamaya çalışarak yardımcı ve “kullanıcı dostu” olmaya çalıştı ve bu nedenle hatalı işaretlemeye izin verdi (ör.<b><i>foobar</b></i> doğru bold- olarak kılacak italik).

Bu bir dereceye kadar mantıklıydı çünkü bir tarayıcı sözdizimi hataları hakkında şikayet etmeye devam ederken bir başkası attığınız herhangi bir şeyi yedikten ve (az ya da çok) doğru bir sonuç verdiğinde, insanlar doğal olarak ikincisine akın ederdi.

Birçoğu tarayıcı savaşlarının bittiğini düşünürken, Chrome'un piyasaya sürülmesinden bu yana son birkaç yıl içinde tarayıcı satıcıları arasında yeni bir savaş hüküm sürdü, Apple tekrar büyümeye başladı ve Safari'yi itti ve IE egemenliğini kaybetti. (Tarayıcı satıcıları tarafından standartların algılanan işbirliği ve desteği nedeniyle buna “soğuk savaş” diyebilirsiniz.) Bu nedenle, web standartlarına kesinlikle uyduğu düşünülen çağdaş tarayıcıların bile gerçekten “akıllı” olmaya çalıştığı ve daha önce olduğu gibi bir avantaj elde etmek için bunun gibi standart kırma davranışlarına izin verin.

Ne yazık ki, büyük bir yol açtı bu keyfi davranışı ( bazı kötü işaretlenmiş web sayfalarının büyüme kudretinin bile kanserli derler). IE en yumuşak ve popüler tarayıcı olduğundan ve Microsoft'un standartların sürekli yayılmasından dolayı, IE kötü tasarımı teşvik etmek ve teşvik etmek ve bozuk sayfaları yaymak ve sürdürmek için ünlüydü.

Şimdilik bazı tarayıcılarda tuhaflıkları ve istismarları kullanmaktan kurtulabilirsiniz, ancak ara sıra bulmaca veya oyun veya başka bir şey dışında, doğru bir şekilde görüntülenmelerini sağlamak için web sayfaları ve siteler oluştururken her zaman web standartlarına bağlı kalmalısınız. bir tarayıcı güncellemesiyle kırılmalarını (tamamen göz ardı edilmelerini) önleyin.

Tarayıcılar, geçerli olup olmadıklarına bakılmaksızın genellikle CSS'yi HTML etiketleriyle ilişkilendirirken, kesinlikle bunu YAPMAMALISINIZ.

Teknik olarak bir CSS perspektifinden yanlış bir şey yoktur. Ancak, tamamlanmış etiketleri kullanmak ASLA HTML'de yapmanız gereken bir şey değildir.

HTML bir biçimlendirme dilidir, yani her etiket belirli bir bilgi türüne karşılık gelir.

Oluşturulan etiketleriniz hiçbir türde bilgiye karşılık gelmiyor. Bu, Google gibi web tarayıcılarından sorun yaratacaktır.

Doğru işaretlemenin önemi hakkında daha fazla bilgi edinin .

Düzenle

Div'ler, blok biçiminde görüntülenmesi amaçlanan ve bu şekilde manipüle edilebilecek birden fazla ilişkili eleman grubuna karşılık gelir.

Açıklıklar, stillendirilecekleri, içinde bulundukları bağlamdan farklı şekilde ifade eder ve blok olarak değil, satır içi olarak görüntülenmesi gereken öğeleri ifade eder. Bir cümledeki birkaç kelimenin tümünün büyük harf olması gerekiyorsa buna bir örnek verilebilir.

Özel etiketler hiçbir standartla ilişkili değildir ve bu nedenle span / div sınıf / kimlik özellikleriyle kullanılmalıdır.

Orada çok gibi bu özel muafiyetler, Açısal JS

CSS'de "etiket seçici" adı verilen bir şey olsa da, aslında bir etiketin ne olduğunu bilmiyor. Belgenin dilinin tanımlaması için bu kaldı. CSS, yalnızca HTML ile değil, aynı zamanda (DTD veya başka bir doğrulama şeması kullanmadığınız varsayılarak) etiketlerin hemen hemen her şey olabileceği XML ile kullanılmak üzere tasarlanmıştır. Diğer etiketlerle de kullanabilirsiniz, ancak "etiketler" ve "öznitelikler" gibi şeylerin tam olarak ne anlama geldiğini öğrenmek için kendi anlambiliminizi bulmanız gerekir.

Tarayıcılar genellikle HTML'deki bilinmeyen etiketlere CSS uygular, çünkü bunun tamamen kırılmasından daha iyi olduğu düşünülür: en azından bir şey görüntüleyebilirler. Ancak kasten "sahte" etiketleri kullanmak çok kötü bir uygulamadır. Bunun bir nedeni, yeni etiketlerin zaman zaman tanımlanmasıdır ve sahte etiketinize benzeyen ancak aynı şekilde çalışmayan bir tanımlanırsa, sitenizde yeni tarayıcılarda sorunlara neden olabilir.

CSS neden sahte öğelerle çalışıyor? Çünkü kimseye zarar vermez çünkü onları zaten kullanmamanız gerekir.

Profesörüm neden makyaj elemanları kullanmamı istemiyor? Çünkü bu öğe gelecekte bir spesifikasyon ile tanımlanmışsa, elementiniz öngörülemeyen bir davranışa sahip olacaktır.

Ayrıca, neden makyaj öğelerinin var olduğunu ve CSS ile çalıştığını bilmiyordu. Bunlar nadir mi? Çünkü, diğer web geliştiricilerinin çoğu gibi, gelecekte rastgele bozulabilecek şeyleri kullanmamamız gerektiğini anlıyor.