5.1 Stilattributet för en tagg
Och några fler användbara saker om HTML. När webben började bli populär blev det en växande efterfrågan på att webbsidor skulle vara vackert eller mycket vackert designade. Detta problem löstes genom att använda style
.
Den allmänna formen för detta attribut har följande format:
<tag style="name=value;name2=value2;nameN=valueN">
Attributvärdet, separerat style
med semikolon, listar alla "stilar" som måste appliceras på taggen.
Låt oss säga att du vill visa en bild som en kvadrat 100*100
och även göra den halvtransparent. För att göra detta måste du lägga till speciella stilar till den:
- bredd=100px;
- höjd=100px;
- opacitet=0,5;
Då kommer HTML-koden med den här bilden att se ut så här:
<img src="logo.png" style="width=100px;height=100px;opacity=0.5">
Det finns hundratals, om inte tusentals, stilar. Och webbläsarutvecklare kommer hela tiden med nya. Det är bra att du studerar till Java-utvecklare, inte webbdesigner :)
5.2 Populära CSS-stilar
Det är osannolikt att du kommer att skriva mycket HTML-kod eller redigera dess stilar i ditt liv, men allt kan hända. Till exempel skriver du ett par små HTML-sidor för att testa API
. Därför HTML
kan det vara till hjälp att känna till de grundläggande stilarna.
Nedan är de 10 vanligaste för backend-utvecklare:
# | namn | Exempel | Beskrivning |
---|---|---|---|
1 | bredd | bredd: 100px | elementets bredd i pixlar |
2 | höjd | höjd: 50% | elementets höjd i procent (av förälderns bredd) |
3 | visa | display: ingen | visa element (visa inte element) |
4 | synlighet | synlighet: dold | elementets synlighet (elementet är dolt, men utrymme är reserverat för det) |
5 | Färg | färgen röd; | text färg |
6 | bakgrundsfärg | bakgrundsfärg: rök | bakgrundsfärg |
7 | gräns | kant: 1px helt svart; | kant (bredd 1px, färg svart, heldragen linje) |
8 | font | typsnitt: verdana 10pt | typsnitt: verdana, storlek 10pt |
9 | textjustera | text-align: center; | textjustering horisontellt |
10 | marginal | marginal: 2px | stoppning utanför elementet |
Du behöver inte komma ihåg dessa taggar, allt finns på Internet. Dessutom har varje "stil" sin egen uppsättning giltiga värden och sitt eget format för att beskriva värdet. Titta åtminstone på border
eller font
.