HTML Div Styles

HTML Div Styles


Den DIV tag definerer en avdeling eller del av et HTML-dokument og brukes til å bruke stiler til en gruppe av elementer. Ligner på <body> -koden, DIV elementene arbeider bak kulissene gruppere andre koder sammen. Brukes i innholds stilark DIV elementer definere stilen og strukturen på en nettside og støttes på alle de store nettleserne.

Inline stil

Den DIV tag støtter flere standard egenskaper, inkludert stil. Stilen tag angir informasjonen stil for et HTML-dokument, for eksempel farge, skriftstørrelse eller justering.

Inline stiler mister mange av fordelene med eksterne eller interne stilark, så bør brukes med måte. Stil attributter som er lagt til den aktuelle HTML-koden kan inneholde CSS eiendom, for eksempel farge, margin, og font-size.

<Div style = "bakgrunn: blue"> <p> Dette avsnittet viser i en blå boks </ p> </ div>.

<P> Men denne paragrafen har ikke en blå bakgrunn som det sitter utenfor <div> container området. </ P>

style Sheet

En mer effektiv måte å produsere HTML websider bruker en ekstern eller intern stilark. Den lar deg enkelt gjøre endringer over et område og eliminerer koding rot fra din side.

Eksempelet nedenfor viser kraften i <div> element når designe websider. Også når inkludert i et eksternt stilark eller CSS, er site-messig modifisering mye enklere.

<Style type = "text / css">

div.important {

background-color: blue;

font-style: italic;

farge: #fff;

}

</ Style>

<Div class = "viktig">

<P> Dette avsnittet viser i en blå boks. </ P>

<P> Teksten vil være hvit og kursiv. </ P>

</ Div>

<P> Men denne boksen vises ikke i en blå boks er heller ikke kursiv eller hvit. </ P>

Juster Eiendom

DIV-koder tilbyr en rask og enkel måte å bruke egenskapene til blokker med tekst, for eksempel justering. I stedet for å bruke den "align" eiendom til hvert avsnitt div tag kan du enkelt søke eiendommen til blokker av avsnitt.

Eksempel 1:

<P align = "center"> Første ledd av teksten som er sentrert på siden. </ P>

<P align = "center"> Avsnitt to av teksten som også er sentrert og justere eiendom brukt. </ P>

Eksempel 2:

<Div align = "center">

<P> Første ledd av teksten som er sentrert på siden. </ P>

<P> Avsnitt to av teksten som også er sentrert, men er skrevet på samme måte som en normal ledd, med bruk av DIV tag å sentrere all informasjon mellom åpning og lukking DIV-koder. </ P>

</ Div>

span Element

Ligner på DIV element span elementgruppene innebygde elementer i et HTML-dokument. Brukes som en plassholder eller merking punktet, <span> element angir begynnelsen og slutten av stilen i et avsnitt. Selv inline stiler kan brukes, er interne eller eksterne CSS-klasser anbefales.

<Style type = "text / css">

span.example {

background-color: blue;

font-style: italic;

farge: #fff;

}

</ Style>

<P> Denne paragrafen vises som grunnleggende svart tekst på hvit side. Når span element er innført, <span class = "eksempel"> det tar på de stilsett i CSS på en blå bakgrunn, hvit, kursiv tekst. </ Span> All tekst etter stengetid span tilbake til den opprinnelige visningen av svart tekst på hvit. </ p>