HTML5 + CSS3 logó
  WEBFEJLESZTÉS, WEBÁRUHÁZ KÉSZÍTÉS   Ingyenes elektronikus tananyag interaktív
weboldalak készítéséhez.
Custom Search
 
vissza VISSZA    
menü MENÜ    
ismét ISMÉT    
tovább TOVÁBB    

Külső stíluslap használata



Külső stíluslapok beillesztése


A stíluslapok használatával szétválik a tartalom és a forma.

A weboldalak tartalmi elemeit a HTML kód, míg a tartalom megjelenítésére vonatkozó stílusdeklarációkat a CSS kód tartalmazza egy-egy külön szöveges állományban. A HTML kódot tartalmazó fájl kiterjesztése .html, a CSS kódot tárolóé .css.

Különösen összetett webhelyek esetén hasznos a külső stíluslapok használata. Ekkor ugyanis csupán egyszer kell beállítanunk a webhely oldalain található HTML elemek stílusjellemzőit. Az elkészült CSS fájlt (stíluslapot) használva valamennyi weboldalon könnyen biztosítható az egységes megjelenés.

Ha egy stíluselemet kívánunk később módosítani a webhely valamennyi oldalán (mai lehet több száz vagy több ezer is.) elegendő egy helyen elvégezni a változtatást.

Példa:

HTML kód


 <!DOCTYPE html>
<html lang="hu"> 
     <head> 
            <title> EZ AZ OLDAL NEVE </title> 
            <meta charset="UTF-8">            
            <link rel="icon" type="image/gif" href="favicon.ico"> 
            
            <link rel="stylesheet" type="text/css" href="f_5.css"> 
 
     </head> 
     <body> 
            Külső CSS stíluslapot használunk. 
     </body> 
</html>  

CSS kód


body {
  font-size: 34px;
  text-align: center;
}

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ő: html5_css_kulso.html