Nettsider med væske- eller væskebreddesetting Bruk hele bredden på nettleseren. Dette er fordi en eller flere kolonner automatisk må endres for å passe til nettleserens vindusstørrelse. Så væskeoppsettet er mer vennlig fordi den tilpasser seg seerens skjermstørrelse. Mer spesifikt, for å lage en væskebreddeoppsett, må elementets bredde spesifiseres i "prosentdel”.

Denne bloggen vil guide deg om å lage en fast breddeoppsett med CSS.

Hvordan lage væskebreddeoppsett ved hjelp av CSS?

I HTML, først, legg til et DIV -element med et klassenavn “væskebredde”. Legg så til

og

elementer for å legge til noe innhold.

Html

Velkommen til Linuxhint

Linuxhint er det beste nettstedet på nettet. Hvis du vil lære bash -programmering, er du på rett sted.

Å legge til koden ovenfor i HTML -filen vil vise følgende utdata:

Strukturen på siden er fullført. Nå, i neste avsnitt, vil HTML -elementene bli stylet ved hjelp av flere CSS -egenskaper.

Stil alle elementer

*
Margin: 0px;
polstring: 0px;

Alle HTML -elementene som er spesifisert i filen vil ha en 0px -margin og 0px polstring.

Stil væskebredde div

.væskebredde
bakgrunnsfarge: RGB (238, 238, 238);
Bredde: 90%;
Margin: Auto;
Høyde: 100VH;

Følgende er beskrivelsen av egenskapene som brukes på div væskebredde:

• “.væskebredde”Brukes for å få tilgang til klassevæskebredden. Her, " . ”Sign er kjent som en klasseleser.
• “bakgrunnsfarge”Eiendom bestemmer elementets bakgrunnsfarge.
• “bredde”Eiendom spesifiserer elementets bredde.
• “margin”Eiendom gir plass rundt elementene.
• “høyde”Eiendom setter elementets høyde.

Ved å gi den ovennevnte koden, vil utdataene vises som følger:

Det kan sees at størrelsen på væskebredde div justeres i henhold til skjermstørrelsen. Det betyr at elementene som er spesifisert i prosenter, vil sette sin bredde i henhold til skjermoppløsningen.

Slik kan vi lage en væskebreddeoppsett i CSS.

Konklusjon

Utviklerne må være veldig forsiktige mens de designer alle applikasjoner. De må huske på hvordan de vil at applikasjonen deres skal vises på forskjellige enheter. Et slikt er å angi oppsettet på websiden. For å lage en layout brukervennlig og responsiv, dessuten “prosentdel”Enheten må brukes. Denne bloggen har med hell forklart hvordan du lager en væskebreddeoppsett i CSS med et eksempel.