Understanding WCAG 2.0

Skip to Content (Press Enter)

F87: Az 1.3.1 teljesítési feltételhez tartozó hiba, amelyet a CSS-be a :before és :after pszeudo elemek, valamint a 'content' tulajdonság segítségével beillesztett nem-dekoratív tartalom okoz

Alkalmazás

Minden CSS-t támogató technológia.

Ez a hiba az alábbiakra vonatkozik:

A felhasználói programra és a segítő technológia támogatására vonatkozó megjegyzések

A :before and :after elemeket az IE7 és korábbi változatai nem támogatják.

Leírás

A CSS-ben használatos :before és :after elemek egy adott tartalom helyét határozzák meg a dokumentum keresőfa szerkezetében. Az említett pszeudo elemekkel kapcsolatban álló content tulajdonság határozza meg a beillesztett tartalom jellegét. A tartalom megtekintése érdekében a formázási eszközöket kikapcsolni, vagy beállítani kénytelen felhasználók segítő technológiái nem minden esetben lesznek képesek a CSS-el beillesztett információk megjelenítésére. Ezért az ezzel a technikával beillesztett nem-dekoratív elemek hibának minősülnek.

Példák

1. hiba példa

Az alábbi példában a :before és :after elemek a beszélő változtatásaira utalnak és idézőjeleket helyeznek el a képernyőn.

A CSS tartalma:

Példa kód:

 p.jim:before {  content: "Jim: " }
p.mary:before { content: "Mary: " }
q:before { content: open-quote }
q:after  { content: close-quote }

Az alábbi példában is ez került alkalmazásra:

Példa kód:

 <p class="jim">
 <q>Do you think he's going to make it?</q>
</p>
<p class="mary">
 <q>It's not looking good.</q>
</p>
2. hiba példa

Az alábbi példában a :before elem a tények és a vélemények megkülönböztetésére szolgál.

A CSS tartalma:

Példa kód:

 p.fact:before { content: "Fact: "; font-weight: bold; }
 p.opinion:before { content: "Opinion: "; font-weight: bold; }

Az alábbi példában is ez került alkalmazásra:

Példa kód:

 <p class="fact">
 The defendant was at the scene of the crime when it occurred. 
</p>
<p class="opinion">
 The defendant committed the crime. 
</p>

Források

A források csak információs célokat szolgálnak, és csak angolul elérhetőek.

Ellenőrzések

Folyamat

  1. Ellenőrizze a :before és :after pszeudo elemek, illetve a content tulajdonság segítségével beillesztett összes tartalmat.

  2. Ellenőrizze, hogy a beillesztett tartalom dekorációs célokat szolgál-e.

  3. Abban az esetben, ha a tartalom nem dekoratív ellenőrizze, hogy az információ megjeleníthető-e a segítő technológiákkal és a CSS kikapcsolása esetén is elérhető marad-e.

Elvárható eredmények

  • Amennyiben a 2. és 3. pontok hamisak, akkor a hiba bekövetkezik és a tartalom nem felel meg a teljesítési feltétel követelményeinek.

Ez a weboldal A Technikák és Gyakori Hibák a Web Akadálymentesítési Útmutató 2.0-hoz része. Ez a dokumentum elérhető egy HTML fájlban is. Nézze meg a A WCAG 2.0 dokumentumait ezen dokumentum és a WCAG 2.0 egyéb dokumentumai között fennálló kapcsolatok áttekintéséhez.

Copyright © 2008 W3C® ( MIT, ERCIM, Keio), Minden jog fenntartva. Alkalmazandók a W3C felelősségi, védjegyoltalmi és dokumentumhasználati előírásai.