logó WEBFEJLESZTÉS, WEBÁRUHÁZ KÉSZÍTÉS
Ingyenes elektronikus tananyag interaktív weboldalak készítéséhez.
visszaVISSZA   
menüMENÜ   

Beszúrt tartalom



A :before álelem kijelölő segítségével a kijelölt HTML elem elé és az :after álelem kijelölő segítségével pedig mögé szúrhatunk be a HTML kódban nem szereplő tartalmakat.

A beszúrt a content tulajdonságban adható meg. A tartalom lehet szöveg, külső objektum, idézőjel, egy számláló értéke vagy egy css tulajdonság értéke

:before álelem


Hatás: A content tulajdonságban megadott tartalmat beszúrja a HTML elem elé.

:before
{
content:
:
beszúrt tartalom;
}


:after álelem


Hatás: A content tulajdonságban megadott tartalmat beszúrja a HTML elem mögé.

:after
{
content:
:
beszúrt tartalom;
}


Példa:

Forráskód



<style>
   p:before {content:"Bekezdés:"; background-color:yellow;}  
   h2:before {content:url("Z_labda_17.png") " ";} 
   a:after { content: " (" attr(href) ") "; }  
   q:before { content: open-quote; }    
</style>     
….
<body> 
  <h2>Ez egy címsor </h2>
  <p>Ez egy bekezdés</p>  
  <a href="https://informatika.gtportal.eu/"> 
      Informatika tananyag</a> 
  <br> <br> 
  <q>Ez egy idézet</q>    
</body>
 

Eredmény*


* Az eredmény megjelenítése az Ön által használt böngészőtől függ.
A példakód külön ablakban is megtekinthető: css_beszurt_tartalom_01.html


Ahogy a legtöbb honlap, ez a webhely is használ sütiket a weboldalain.