CSS (angl.Cascading Style Sheets – pakopiniai stilių šablonai) –pakopinių stilių aprašo kalba, skirtaHTML kalba rašomų dokumentų stiliams aprašyti.[1] Nors įprastai CSS kalba aprašomas HTML dokumentų pateikimas, be to ją galima taikyti ir įvairiems kitomis kalbomis parašytiems dokumentams (pvz.,XML paremtiemsSVG irXUL).
Stiliaus taisyklė apibrėžiama šia sintakse:
identifikatorius {savybė: reikšmė;}CSS identifikatorium gali būti bet kuris HTML elementas, taip pat identifikatoriumi gali būt apibrėžta klasė. Pavyzdžiui,
p {text-align: center;} aprašo stilių HTML pastraipos elementuip (<p>). Stilius gali būti sudaromas aprašant keletą savybių (atskirtų kabliataškiu):
p {text-align:center; color:red;}Internetinio puslapio pastraipų tekstas bus centruotas, raudonas.
HTML elementui galima priskirti klasės atributą, o tai leidžia tam pačiam elementui turėti skirtingus stilius. Pavyzdžiui, norima, kad dvi pastraipos būtų skirtingai lygiuojamos:
p.desineje {text-align: right;}p.centruoti {text-align: center;}HTML dokumente norimos pastraipos aprašomos taip:
<p>Ši pastraipa bus lygiuota dešinėje.</p>
ir
<p>Ši pastraipa bus centruota.</p>
Elementui galima priskirti keletą klasių vienu metu, tačiau persidengiantys stiliai bus perrašyti:
<p>Pastraipa su dviem klasėm.</p>
Labai patogu, kai klasės pavadinamos pagal tai, kokį stilių jos suteikia. Iš užrašop galima suprasti, kad pastraipa bus lygiuojama prie dešinės paraštės.
Galima aprašyti stilių pagal elemento identifikatorių:
#identifikatorius {text-align: right;}Tada tik elementui su tuo identifikatorium bus taikomas aprašytas stilius:
<p>Ši pastraipa bus lygiuota dešinėje.</p>
CSS tekstas įrašomas atskirame faile, pvz.,stilius.css, o kelias iki failo nurodomas HTML dokumente <head> dalyje, naudojant <link> žymes:
<head><title>Susietas CSS</title><link rel="stylesheet" type="text/css" href="stilius.css"></head>
Šis variantas patogus, kai svetainę sudaro daug failų. Tokiu būdu galima pakartotinai panaudoti tą patį stilių skirtinguose tinklalapiuose nedubliuojant jo teksto, o stiliaus pataisymai iš karto paveikia visus tinklalapius, kuriuose jis yra naudojamas.
Toks stilius aprašomas antraštinėje HTML dokumento dalyje. Štai toks tinklalapio išeities tekstas nupieš Lietuvos Respublikos vėliavą.
<html><head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title> Lietuvos vėliava, nupiešta CSS </title> <style type="text/css"> body { margin:0; padding:0; } #veliava { margin: 0 auto 0 auto; height: 300px; width: 450px; } #geltona { background-color: rgb(253, 185, 19); /* arba background-color: #FDB913; */ } #zalia { background-color: rgb(0, 106, 68); /* arba background-color: #006A44; */ } #raudona { background-color: rgb(193, 39, 45); /* arba background-color: #C1272D; */ } #geltona, #zalia, #raudona { height: 100px; } </style></head><body><div> <div> </div> <div> </div> <div> </div> </div></body></html>
| Šis straipsnis apiekompiuterių tinklus yranebaigtas. Jūs galite prisidėti prie Vikipedijospapildydami šį straipsnį. |