CodeGym /Kurs /All lectures for NO purposes /Introduksjon til CSS

Introduksjon til CSS

All lectures for NO purposes
Nivå, Lekse
Tilgjengelig

5.1 Stilattributtet til en tag

Og noen flere nyttige ting om HTML. Etter hvert som nettet begynte å bli populært, var det en økende etterspørsel etter at nettsider skulle være vakkert eller veldig vakkert utformet. Dette problemet ble løst ved å bruke style .

Den generelle formen for dette attributtet har følgende format:


        <tag style="name=value;name2=value2;nameN=valueN">
    

Attributtverdien, atskilt stylemed semikolon, viser alle "stilene" som må brukes på taggen.

La oss si at du vil vise et bilde som en firkant 100*100og også gjøre det halvgjennomsiktig. For å gjøre dette må du legge til spesielle stiler:

  • width=100px;
  • høyde=100 piksler;
  • opasitet=0,5;

Da vil HTML-koden med dette bildet se slik ut:


       <img src="logo.png" style="width=100px;height=100px;opacity=0.5">
    

Det er hundrevis, om ikke tusenvis, av stiler. Og nettleserutviklere kommer stadig med nye. Det er bra at du studerer til å bli Java-utvikler, ikke webdesigner :)

5.2 Populære CSS-stiler

Det er usannsynlig at du vil skrive mye HTML-kode eller redigere stilene i livet ditt, men alt kan skje. Du skriver for eksempel et par små HTML-sider for å teste API. Derfor HTMLkan det være nyttig å kjenne til de grunnleggende stilene.

Nedenfor er de 10 vanligste for backend-utviklere:

# Navn Eksempel Beskrivelse
1 bredde bredde: 100px elementbredde i piksler
2 høyde høyde: 50 % elementets høyde i prosent (av foreldrenes bredde)
3 vise display: ingen visningselement (ikke vis element)
4 synlighet synlighet: skjult elementsynlighet (element er skjult, men plass er reservert for det)
5 farge fargen rød; tekstfarge
6 bakgrunnsfarge bakgrunnsfarge: røyk bakgrunnsfarge
7 grense kantlinje: 1px helt svart; kantlinje (bredde 1px, farge svart, heltrukket linje)
8 font skrift: verdana 10pt font: verdana, størrelse 10pt
9 tekstjustering tekst-align: center; tekstjustering horisontalt
10 margin margin: 2px polstring utenfor elementet

Du trenger ikke å huske disse kodene, alt er på Internett. Dessuten har hver "stil" sitt eget sett med gyldige verdier og sitt eget format for å beskrive verdien. Se i det minste på bordereller font.

Kommentarer
TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION