Mange mennesker, der er nye til webdesign og HTML / CSS bruger og Div-elementet definerer logiske divisioner på din webside. Det er dybest set en boks, hvor du kan placere andre HTML-elementer, som logisk går sammen. En division kan have flere andre elementer i den, som afsnit, overskrifter, lister, links, billeder osv. Det kan endda have andre divisioner inde i det for at give yderligere struktur og organisation til dit HTML-dokument. For at bruge div-elementet skal du placere en åben id = "myDiv">
) eller en klassevælger (f.eks. class = "bigDiv"> Div-elementet er forskelligt fra HTML5-sektionselementet, fordi det ikke giver det medfølgende indhold nogen semantisk betydning. Hvis du ikke er sikker på, om indholdsblokken skal være en div eller et afsnit, skal du tænke over, hvad formålet med elementet og indholdet er at hjælpe dig med at bestemme, hvad du skal bruge: I sidste ende opfører begge divs og sektioner stort set på samme måde, og du kan give en af dem attributværdier og stil dem med CSS for at få udseendet af dit websted, du har brug for. Begge disse er blokniveau elementer. Spændelementet er som standard et inline-element. Dette sætter det fra hinanden fra div og sektionselementerne. Spændelementet bruges ofte til at indpakke et bestemt stykke indhold, normalt tekst, for at give det en ekstra "krog", som kan styles senere. Bruges med CSS, kan det ændre stilen på den tekst, den omslutter; Men uden spændingsattributter har spændingselementet alene ingen virkning på tekst overhovedet. Dette er den største forskel mellem spændet og div-elementerne. Som nævnt ovenfor indeholder div-elementet en afsnitspause, mens spanelementet kun fortæller browseren at anvende tilknyttede CSS-stilregler til, hvad der er vedlagt af tags: Fremhævet tekst og ikke-fremhævet tekst. Tilføj class = "highlight"
eller anden klasse til spændelementet for at indstille teksten med CSS (f.eks. class = "highlight">
) .Spændelementet har ingen nødvendige attributter, men de tre, der er mest nyttige, er de samme som div-elementets: Brug span, når du vil ændre indholdsstilen uden at definere det indhold som et nyt blokniveauelement i dokumentet. Hvis du f.eks. Vil have det andet ord i en h3-overskrift til at være rødt, kan du omslutte det pågældende ord med et spændingselement, der ville formatere det pågældende ord som rød tekst. Ordet er stadig en del af h3-elementet, men nu vises også i rødt: Bruger
). Begge disse attributter kan derefter vælges ved hjælp af CSS eller modificeret ved hjælp af JavaScript. Nuværende bedste praksis lægger vægt på at bruge klassevalgere i stedet for id'er, dels på grund af, hvordan specifikke ID-selektorer er. I sandhed kan du dog bruge enten en og kan endda give en division både et ID og en klassevælger. Når du skal bruge
Bruger Element
Dette er min fantastiske overskrift
elementer i indbyrdes omveksling, da de udbygger websider. Virkeligheden er imidlertid, at hver af disse HTML-elementer tjener forskellige formål. At lære at bruge hver til det tilsigtede formål, vil hjælpe dig med at udvikle renere websider, hvis kode er lettere at administrere overordnet.
Element
tag før området på din side, som du vil have som en separat division, og et tæt
tag efter det:
indhold af div
Hvis området på din side har brug for nogle yderligere oplysninger, som du vil bruge til at style med CSS senere, kan du tilføje en idvælger (f.eks.
Imod
