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.