1. Sākums
  2. Dokumentācija
  3. HTML un CSS pamācības – kā izveidot mājas lapu bez priekšzināsanām 2020
  4. Ievads CSS – pamācība

Ievads CSS – pamācība

css pamācības - ievads css

Lai apgūtu šo pamācību, Tev pirms tam jābūt izveidotam HTML failam un datorā uzstādītam koda editoram. Ja nezini kā izveidot, to vari apgūt pamācībā Ievads HTML.

Ar CSS palīdzību mēs piešķirsim dizainu HTML dokumentam. Lai to izdarītu būs nepieciešams izveidot css failu.

    1. Atveriet koda redaktoru, piemēram Brackets vai Notepad ++ vai Sublime un izveidojiet jaunu failu ar paplašinājumu .css, nosauciet to par stils.css un saglabājiet tajā pat mapē, kur atrodas index.html fails, ko izveidojām iepriekš.CSS stila faila izveide
    2. Atveriet iepriekš izveidoto index.html failu un galvenē (head) norādiet ceļu uz CSS failu. Tādā veidā tiek HTML dokuments tiek sasaistīts ar CSS failu, no kura HTML dokuments iegūs savu jauno izskatu, ko mēs piešķirsim tālākajos soļos.  Rel norāda attiecības starp failiem, stylesheet norāda, ka jāimportē stila lapa. Href – ir saite uz css failu, jeb ceļš. Ja css fails atrodas tajā pat mapē, kur index.html fails, var norādīt tikai faila nosaukumu. Ja css fails atrodas, kur citur, jānorāda pilns ceļš, līdzīgi kā bija ar attēliem (par to vairāk vari atrast šeit). Tā kā iepriekš izveidojām un saglabājām css failu stils.css tajā pat mapē, kur atrodas index.html dokuments, varam norādīt tikai faila nosaukumu stils.css.
      <link rel="stylesheet" href="stils.css">saite uz css failu html dokumentā
    3. Atveriet stils.css failu un pievienosim pirmās īpašības HTML elementiem, kas ir mūsu index.html failā.
      CSS sastāv no selektora, un bloka ar īpašībām un vērtībām. Piemēram, ja mēs vēlētos, lai mūsu visi pirmā līmeņa virsraksti mājas lapā būtu sarkanā krāsā un 16px izmērā, mēs CSS failā rakstītu selektoru h1 u pievienotu tādas īpašības kā color (krāsa) un font-size (fonta izmērs) un pievienotu vērtības sarkans un 16 px. CSS sintakse (pieraksta veids un formatējums) izskatās šādi:
      selektors{
      īpašība:vērtība;
      īpašība:vērtība;
      }
      jeb konkrētajā piemērā ar pirmā līmeņa virsrakstu tas būtu šādi, pievienojiet zemāk redzamo bloku stils.css failam:
      h1{
      color:red;
      font-size:16px;
      }
      h1 virsraksta noformēšana ar cssh1 virsraksta noformēšana ar css

Katra rindiņa īpašību blokā jānobeidz ar semikolu; Bloks tiek atvērts ar figūriekavām un aizvērts ar figūriekavām. Tādā pat veidā var pievienot krāsas, fontus, izmērus, novietojumu arī citiem elementiem, piemēram p (paregrāfiem), body (visai mājaslapai, piemēram noteikt mājas lapas fona krāsu) u.c.

Lai vēlāk neaizmirstu ko nozīmē katrs no selektoriem un īpašībām, Jūs CSS failā variet pierakstīt komentārus. Kā pievienot komentārus lūdzu skatiet pamācību Kā pievienot komentārus CSS

Vai šis raksts Jums noderēja? 3

Sazinies ar mums!