A webfejlesztés nagymértékben három fő nyelvre támaszkodik, nevezetesen a HTML-re, a CSS-re és a Javascriptre. A HTML a webhelyek szerkezetét írja le, vagyis azt, hogy milyen elemek találhatók a weboldalon.
A Cascading Style Sheets (CSS) viszont leírja, hogy a HTML-elemek hogyan jelennek meg vizuálisan, míg a Javascript interaktivitást és dinamikus viselkedést ad a weboldalakhoz.
A CSS különösen fontos, ha esztétikusan tetszetős felhasználói felületeket kell létrehozni, kiváló felhasználói élményt nyújtva. A CSS felelős a webes tartalom megjelenítéséért és stílusáért, és a weboldalak elrendezésének, megjelenésének és stílusának szabályozására szolgál.
Például a CSS használatával módosíthatja a tartalom megjelenítési módját a weboldalon, és módosíthatja többek között a betűtípusokat, színeket, szegélyeket, margókat, térközöket és háttereket.
Ezenkívül a CSS kulcsfontosságú a reszponzív webhelyek létrehozásában, amelyek alkalmazkodnak a különböző képernyőméretekhez és eszközökhöz. Ezenkívül lehetővé teszi a konzisztens és egységes stílusok kialakítását a webhely különböző oldalain, és segít a webhelyek elérhetővé tételében a fogyatékkal élő felhasználók számára.
Abban az esetben, ha webhelyét a márkájához kívánja igazítani, és jól szeretné használni a márka színeit a webhelyén, a CSS az, ami lehetővé teszi ezt.
CSS nélkül a webhelyek valószínűleg nagyon hasonlóan néznének ki, nagyon nyájas dizájnnal, stílusok, színek, lebegési effektusok vagy hátterek nélkül. A webhelyek nem lennének reszponzívak, és nagyon kevés személyre szabható lenne a webhely egy márkához igazítása.
Ezért a CSS nagyon fontos eszköz a webfejlesztők számára. A CSS használatához a webhelyén össze kell kapcsolnia az oldal HTML-kódjával. Ne feledje, a HTML egy webhely elemeit és tartalmát írja le.
Ezért össze kell kapcsolnia a HTML-kódját a CSS-szel, hogy a CSS-t használni tudja webhelye elemeinek és tartalmának stílusához. Ez a cikk megtanítja, hogyan kell ezt megtenni. Mielőtt azonban megvizsgálnánk, hogyan lehet a CSS-t HTML-hez kapcsolni, nézzük meg a CSS írásának és a HTML-elemek stílusának kialakításának különböző módjait.
Tartalomjegyzék
Különböző módok a CSS-nek a HTML-be való felvételére
Három fő módja van a CSS-nek a HTML-fájlokba való belefoglalásának. Ebbe beletartozik:
#1. Soron belüli stílusok
Ez magában foglalja a CSS-stílusok közvetlenül az egyes HTML-elemekre történő írását, az alábbiak szerint:
<body style="background-color: yellow;">
<h1 style="color: orangered; font-size: 40px;">etoppc.com</h1>
<p style="color: blue; font-size: 16px;">etoppc.com is an online publication that produces high-quality articles on
Technology, Business, and Fintech to help
businesses and people grow.</p>
</body>
Bár ez a módszer lehetővé teszi a CSS egyszerű hozzáadását HTML-oldalaihoz, ez nem jó módja annak, hogy CSS-t adjon hozzá a HTML-hez. Ennek az az oka, hogy nagyon időigényes, nehezen olvashatóvá és karbantarthatóvá teszi a kódot, különösen a nagyméretű stílusok esetében, és befolyásolhatja a weboldalak betöltési idejét.
#2. Belső CSS
Ez magában foglalja a weboldal stílusainak beírását egy