CSS Pagrindai

Podcast

Play an AI-generated podcast conversation about this lesson

Questions and Answers

Koks yra universalaus selektoriaus sintaksė CSS?

every { color: green; }

all { color: green; }

.universal { color: green; }

* { color: green; } (correct)

Kuri šrifto klasė yra be užraitų?

Times New Roman

Serif

Georgia

Arial (correct)

Kurie parametrai priklauso nuorodos būsenoms CSS?

:focus, :visited, :active

:visited, :hover, :disabled

:link, :hover, :active (correct)

:active, :focus, :visited

Kuri CSS klasė geriausiai tinka tekstui su užraitais?

serif Signup and view all the answers

Koks yra teisingas ID selektoriaus pavyzdys?

#header { color: blue; } Signup and view all the answers

Kas išvardinta kaip šrifto parametras?

font-family Signup and view all the answers

Kuri CSS taisyklė keičia tekstą hover metu?

text-decoration: underline; Signup and view all the answers

Kuri CSS taisyklė nurodo numeruoto sąrašo pradžios numerį?

start Signup and view all the answers

Koks yra tinkamas CSS sintaksės formatas?

selektorius { parametras; reikšmė; } Signup and view all the answers

Kuri iš šių selektorių kategorijų nepriklauso prie paprastų selektorių?

Grafiniai selektoriai Signup and view all the answers

Kaip kartojamo parametro vertė gali būti naudojama CSS taisyklių bloke?

Galima naudoti tik kartą. Signup and view all the answers

Koks yra teisingas pseidoklasės pavyzdys CSS?

p:hover { color: blue; } Signup and view all the answers

Kuri kombinacija yra tinkamas descendant (palikuonio) selektorius?

article p { color: red; } Signup and view all the answers

Koks yra skirtumas tarp klasės ir ID selektorių CSS?

Klasės selektoriai aprašomi tašku, o ID – šauktuku. Signup and view all the answers

Kaip naudojamas inline CSS stilius HTML elemente?

Tekstas Signup and view all the answers

Kuri iš šių teiginių apie CSS selektorius yra neteisinga?

Paprasti selektoriai visada turi apibrėžti spalvą. Signup and view all the answers

Kas atsitiks, jei naudosisite vaiko selektorių ‘article > h3’?

Pasirinksite h3 elementus, kurie yra tiesioginiai children article. Signup and view all the answers

Koks rezultatas bus, kai taikysite ‘article + p’?

Pasirinksite p elementus, kurie seką article como pirmiems. Signup and view all the answers

Kaip veikia bendras sibling selektorius ‘~’?

Pasirinks tą siblingą, kuris seka pirmą siblingą esančio tėvo kontekste. Signup and view all the answers

Kokia yra CSS klasės selektoriaus rašymo sintaksė?

.className Signup and view all the answers

Kas nutinka, jei naudosite ‘article ~ p’?

Pasirinksite p elementus tik tuos, kurie seka article elementą. Signup and view all the answers

Koks CSS selektorius leis jums pasirinkti raudoną spalvą h3 elementui, priklausančiam article?

article > h3 { color: red; } Signup and view all the answers

Koks selektorius pasirinks visus p elementus, esamus bet kurioje article?

article p { } Signup and view all the answers

Kokiu atveju ‘article > h3’ neveiks?

Kai h3 nėra tiesioginis child of article. Signup and view all the answers

Study Notes

CSS apibrėžimas

CSS (Cascading Style Sheets) – pakopiniai stilių šablonai, aprašantys HTML elementų atvaizdavimą.

CSS taikymas

CSS gali būti taikomas trims būdais:
- Inline: stiliai pritaikomi tiesiai HTML elemente.
- Internal (vidinis): stiliai apibrėžiami HTML dokumento viduje, <style> žymėje.
- External (išorinis): stiliai apibrėžiami atskirose .css failuose.

CSS sintaksė

Sintaksė:
- selektorius {
  - parametras: reikšmė;
- }
Vienas parametras gali būti naudojamas tik vieną kartą taisyklių bloke.

Selektorių kategorijos

Paprasti selektoriai (angl. simple selectors)
Kombinacijos (angl. combinators)
ID ir klasės selektoriai
Su atributu (angl. attribute selectors)
Pseudo klasės
Pseudo elementai

Paprasti selektoriai

Naudojami žymėjimuose, pavyzdžiui:
- h2, h3 { color: red; }
- p { color: blue; }

Kombinacijos

Descendant: article p { color: red; }
Direct Child: article > h3 { color: red; }
Child: Pasirenka visus elementus, kurie yra nurodyto elemento vaikai.
Adjacent Sibling: article + p { color: red; }
General Sibling: article ~ p { color: red; }

Klasės

Klasė nurodoma su . (taškas):
- .info { color: blue; }
- .komentaras { color: grey; }

ID selektorius

ID nurodomas su # (cifra):
- #top { color: blue; }
- #bottom { color: grey; }
Rekomenduojama naudoti klasę vietoj ID, jei tai įmanoma.

Universalus selektorius

Universalus selektorius pažymi visus elementus:
- * { color: green; }

Sąrašų parametrai

list-style-type, list-style-position, list-style-image – nustato sąrašų stilių.

Nuorodos parametrai

Nuorodų būsenos:
- :link, :visited, :hover, :active – leidžia keisti nuorodų stilius skirtingomis būsenomis.

Teksto ir šrifto parametrai

Teksto parametrai: text-align, line-height, letter-spacing, word-spacing.
Šrifto parametrai: font-family, font-size, font-style, font-weight, text-transform, text-decoration, color.

Šriftai

Dvi pagrindinės šriftų klasės:
- Serif: šriftai su užraitais (pavyzdžiui: Times, Georgia).
- Sans-serif: šriftai be užraitų (pavyzdžiui: Arial, Helvetica).
Serif šriftus lengviau skaityti spausdintuose dokumentuose, o sans-serif šriftus – ekranuose.

Studying That Suits You

Use AI to generate personalized quizzes and flashcards to suit your learning preferences.

Description

Šis testas suteikia įžvalgų apie CSS (Cascading Style Sheets) pagrindus. Sužinokite apie CSS sintaksę, selektorius, klases ir identifikatorius, tekstą bei šrifto parametrus. Nagrinėsime įvairius CSS taikymo metodus ir jų svarbą HTML dokumentuose.