Kaszkád stíluslapok css - egyszerű

Itt írtunk stílusokat a p (bekezdések) összes elemére. Tekintsük őket részletesebben:

  • background - a háttérszín beállítása. A szín megadható névvel és kóddal.
  • A szélesség a blokk szélessége. Itt van megadva képpontban. Felhívjuk a figyelmet arra, hogy a 250px felirat összeállításra kerül. Ha az egyes mértékegységek külön számot írnak a számról - akkor ez CSS hibát okoz
  • a magasság az elem magassága.

Egyszerűen? Igen! A stílus a tulajdonságban van megadva: érték formátum. A vonal végét pontosvessző jelöli.







Felmerül a kérdés, de ha olyan bekezdés elemét akarjuk létrehozni, amely eltér a tervektől a többi bekezdéstől? Ehhez meg kell adnod az elemnek egy nevet. Két lehetséges módszer létezik:

  • Hozzon létre egy egyedi nevet az elemnek, amely nem fog megismételni az oldalon belül, és egyértelműen jellemzi ezt az elemet. Ezt a nevet egy azonosítónak hívják. Az azonosító beállítása:

  • A második mód az, hogy adjunk egy osztályt az elemhez. Más elemek tartoznak ehhez az osztályhoz.

    Hogyan állíthat be megjelenést egy id és osztályú elemhez? Nézzünk egy példát:

    Amint látja, hogy hivatkozzon az azonosítóval rendelkező elemre, helyezze el a # jelet az azonosító név előtt a CSS-ben. Ha stílusokat szeretne hozzárendelni az elemosztályhoz, tegyen egy időtartamot az osztálynév előtt. Vegye figyelembe, hogy a #one és a .two együtt íródnak.







    Hogyan írjunk szelektort?

    • h2 - az alábbiakban leírt stílusok minden második szintű fejlécre vonatkoznak
    • p - stílusok minden bekezdésre vonatkoznak
    • .az egyik stílus az összes olyan elemre vonatkozik, amelyek az első osztályúak
    • #four - stílus egy id = 4 elemre alkalmazható.
    • A p.one - style az első osztályú bekezdésekre vonatkozik
    • h2 # 5 - a stílus csak a második szint fejlécére vonatkozik, amelynek azonosítója öt

    A következő leckében a szöveges feldolgozás példái láthatók a CSS használatával.

    A CSS - egy hatékony eszköz a tervezési szabályok leírásához - lehetővé teszi nemcsak statikus tervezés megadását, hanem az oldal html elemeinek animálását is. Az animáció példája itt található.

    További cikkek:

    Kaszkád stíluslapok css - egyszerű

    Kaszkád stíluslapok css - egyszerű

    Kaszkád stíluslapok css - egyszerű

    Kaszkád stíluslapok css - egyszerű

    előadások és háttéranyagok




    Kapcsolódó cikkek