Strukturen på nästan alla webbplatser vi hittar och använder på webben har skapats med HTML, ett standardiserat system för att kategorisera textfiler. Sidbrytningar, stycken, starka bokstäver, kursiv stil och andra funktioner läggs till med HTML. Genom att använda taggar, som instruerar webbläsare hur de ska hantera innehåll, hjälper HTML till att skapa denna struktur.

Till exempel skulle vi placera ett ord mellan taggarna strong>bold/strong> för att få det att verka fet. Den inledande taggen (/) indikerar var vi vill att den fetstilta ska sluta, medan den första taggen (/) indikerar var vi vill att den fetstilta ska börja. Det fungerar som grunden för de flesta webbsidor. Så det här är platsen att börja om du lär dig koda.

Hur man lägger till utrymme i HTML

Bortsett från ett enda mellanslag mellan ord, bortses från alla tomma utrymmen vi anger i HTML-text för att visa i en webbläsare. Som ett resultat måste vi programmera de tomma utrymmen vi vill ha i vårt dokument. Alla textrader kan läggas till utrymme i HTML. Till exempel kan vi infoga tomma mellanslag i tabell- och styckeinnehåll med HTML-objektet. Eftersom HTML saknar en tangentbordsbokstav för ett tomt utrymme måste vi ange entiteten för att lägga till varje utrymme.

Det kan verka enkelt, men att lägga till utrymme i vår HTML kan vara utmanande. Det finns minst fem olika sätt att ta hand om detta.

Under den här utbildningen kommer vi att se många exempel. Det kommer också att visa hur man kan använda mer utarbetade former av rymd.

hur får jag reda på storleken på min bildskärm

Allt detta är möjligt i vanlig HTML utan användning av CSS. Men tänk på att lägga till utrymme i din HTML görs bäst via CSS.

Hur ser ett ASCII-utrymme ut?

Utrymmet representeras av ASCII-symbolen 20. Men detta är bara en accepterad praxis.

Det finns fem olika typer av utrymmen som du kan använda i HTML. De verkar identiska med det otränade ögat, även om de har något distinkta funktioner.

Tab-tecknet, som simulerar att trycka på tabbtangenten på ett tangentbord, är ett annat alternativ. Och vagnreturtecknet, som simulerar att trycka på enter-tangenten på ett tangentbord, är ett annat exempel.

Icke-brytande utrymme:

I rymden:  

Em utrymme:  

Tunt utrymme:

Standardutrymme:

Ny linje (retur):

Tabkaraktär:

Den vänstra sidan representerar karaktär , och den högra sidan representerar HTML-kod.

Hur bred är en karaktär i rymden?

För mellanslagstecken finns det fyra standardbredder:

Utrymme med standardbredd:Eftersom det inte kommer att resultera i en radbrytning (även känd som en vagnretur), kallas detta även för 'icke-linjebrytande utrymme'.Em Space:Det här heter 'Em' eftersom det, oavsett typsnitt du använder, har samma bredd som bokstaven M. (Om vi ​​har hört talas om frasen 'em-dash' så vet vi vad vi pratar om.)I rymden:Detta är känt som 'En' eftersom det har samma bredd som bokstaven n i ditt typsnitt.Tunt utrymme:Det smalaste av alla utrymmen är 'tunt utrymme', vilket är det sista alternativet.

Vad betyder Space Sign in HTML?

är den mest använda HTML-entiteten.

arraylist java

För att få den här texten att fylla ett mellanslag, försök att kasta den.

Låt oss till exempel föreställa oss att vi vill lägga till två mellanslag efter en fras, men webbplatsåtergivningsmotorn tar bort ett av mellanrummen på egen hand. För att lägga till två utrymmen kanske vi kan komma in

Whitespace: Vad är det?

Tecken som inte är synliga kallas blanksteg. De består av:

1. utrymmen,
2. flikar och
3. radbrytningar (vagnretur, radmatningar eller båda),

Varför är detta avgörande?

Dessa bokstäver är till exempel inte synliga i en ordbehandlare, men de påverkar utrymmet och formateringen av texten. Webbläsaren kondenserar många blanksteg till ett enda utrymme i HTML, som skiljer sig från andra märkningsspråk.

Det finns flera mellanslag mellan orden i denna HTML, och varje rad slutar med CRLF (carriage return, linefeed) tecken. Alla blanksteg kommer att komprimeras av webbläsaren.

Exempel

Bra saker tar mer tid.

Produktion:

Infoga mellanslag

1. Använd textens icke-avbrytande mellanslagstecken ( ) för att ge mer avstånd.
2. CSS-utfyllnadsegenskapen kan användas för att öka utrymmet inuti ett element under olika omständigheter.
3. CSS-marginalattributet tillåter tillägg av extra utrymme runt ett element.

Även om icke-avbrytande mellanslag är användbara, bör de inte användas överdrivet, eftersom det kan störa hur materialet visas i webbläsare. Dessutom, avstå från att använda oavbrutna mellanslag för stiländamål som att dra in eller centrera ett element på en webbsida; stilkrav bör istället hanteras via CSS.

Förutom entiteten stöder HTML även följande ytterligare entiteter för många intilliggande tomma utrymmen:

Teckenentiteten   används för att representera ett mellanslag. En är en måttenhet som motsvarar 8 pixlar, eller hälften av en ems (16 pixlar) bredd.

Syntaxen för ett en space-mellaninnehåll är   Här är ett exempel på hur du använder HTML &ensp-entiteten:

Här är ett exempel för entiteten en rymden.

Produktion:

Entiteten   används i exemplet ovan för att lägga till mellanslag i HTML, och dess bredd är 8 pixlar. De kan också användas på flera närliggande platser.

Underhålla formatering och mellanrum

Om du vill behålla formateringen och avståndet som har angetts finns det två val:

1. Lägga till HTML-formatering och utrymme
2. Använder en

    tag.

Använder en 'pre'-tagg

Dessa resultat uppstår från att byta ut

tagg för

 tag:

Exempel

 pre> Good things take more time 

Produktion:

mysql uppdatering gå med

Ja den

 tag keeps the formatting as it was originally, but it also switches to a monospaced typeface. All of these can be fixed; however, using the <pre> tag isn&apos;t always the best option. HTML spacing is a more popular method.</pre>

Lägga till HTML-formatering och mellanslag

Som ett alternativ kan vi inkludera HTML-element och symboler som följande:

Bra saker kommer

ta mer tid.

Produktion:

En radbrytning krävs av
element.

Icke-brytande utrymme:

Webbläsaren komprimerar inte mellanslag som lagts till med blanksteg ().

Dessutom, som namnet antyder, hindrar det webbläsaren från att splittra två ord där.

Bra saker tar längre tid.

Produktion:

I denna modell läggs 10 mellanslag till i början av texten. En annan ställs mellan ' tar ' som inte kommer att isoleras när meningen avslutas på grund av utrymmesbegränsningar.

Utfyllnadsattributet

Ett elements inre utrymme utökas med CSS-utfyllnadsattributet.

Det tar värden från ett till fyra, som börjar längst upp, till höger, längst ner och till höger.

De 'div' elementet har en stoppning på 20 pixlar på alla sidor.

hur man uppgraderar java

 Inner spacing is 20px with a div attribute 

Produktion:

Marginalattributet

1. Med CSS-marginalattributet läggs extra utrymme till runt elementet.
2. Det tar värden från ett till fyra, som börjar längst upp, till höger, längst ner och till höger.

De 'div' elementet har en marginal på 40 pixlar på alla sidor.

 Outer spacing is 20px using the div and margin attribute 

Produktion:

Utfyllnad vs marginal

1. Vaddering och marginal ökar båda elementets utrymme.
2. Vaddering lämnar ett tomrum som betraktas som en del av elementet.
3. Marginalskapat utrymme anses existera utanför elementets gränser.
4. Klickregionen, bakgrundsfärgerna och andra attribut på webbplatsen påverkas av denna variant.

Man skulle kunna tro att det är lika enkelt att lägga till mellanslag i HTML som att kontinuerligt trycka på mellanslagstangenten. Men det är bara inte så saker fungerar. Att trycka på mellanslagstangenten mer än en gång kommer inte att lägga till fler närliggande blanksteg som det skulle göra i ett textdokument. Webbläsaren kommer att kombinera alla närliggande tomma utrymmen till ett om vi gör detta i HTML. För att visa vad som händer när vi använder flera blanksteg i HTML, låt oss titta på ett exempel:

Så efter att ha använt mellanslagstangenten många gånger kan vi inte lägga till fler tomma mellanslag

Produktion:

Genom att upprepade gånger trycka på mellanslagstangenten i HTML, som ses i exemplet ovan, försöker vi infoga många på varandra följande tomma blanksteg på en webbsida. Men webbläsare renderar flera intilliggande tomma utrymmen som ett enda utrymme och ignorerar utrymmen före, efter och utanför komponenter. Fenomenet är känt som blankstegskollaps. Även om komprimering av blanksteg kan vara irriterande ibland, finns det flera tekniker för att lägga till mer avstånd i både HTML och CSS (cascading style sheets).

&

Teckenetiteten   används för att representera em space. Bredden på en em, som är 16 pixlar, motsvarar en emsp.

Syntaxen för em-mellanslag i texten är   Här är ett exempel på hur man använder HTML &emsp-entiteten:

Här är ett exempel för em rymdenhet.

Produktion

Entiteten   används i exemplet ovan för att lägga till mellanslag i HTML, och dess bredd är 16 pixlar. De kan också användas i flera angränsande utrymmen.

&tunnsp

Teckenentiteten används för att representera tunt utrymme, ofta känt som smalt utrymme. En sjättedel av en em är bredden på en &

html-taggar

Tunt utrymme skrivs som ett mellaninnehåll i syntaxen. Här är ett exempel på hur man använder HTML-entiteten ' '

Detta är ett exempel på tunn rymdenhet.

Produktion

Entiteten används i exemplet ovan för att lägga till tunna mellanslag i HTML, och dess bredd är en sjättedel av en em. De används också i flera angränsande utrymmen.

Nedan är en ASCII-konst av 'Hej'. # # ##### # # # ##### # # # # # # # # # # ####

Produktion:

Fördelarna med att använda blanksteg

Utökad innehållsuppfattbarhet:När kunder är på vår sida, borde de ha möjlighet att se var de går vidare för att få motivationen att fortsätta läsa. I ärlighetens namn, blanksteg mellan passager och runt textblock och bilder hjälper individer att förstå vad de läser och bidrar till en överlägsen kundupplevelse i allmänhet.Mer samarbete:Kan vi bara vara verkliga, gäster har pålitligt bråttom när de läser lokaler, och att ha mycket blanksteg kommer att öka anslutningen genom att förhindra avbrott som saktar ner gästen. Faktum är att även en lätt dämpning runt föremål får oss att lägga märke till en viss region på vår webbplats. Enligt forskning ledd av Human Elements Worldwide ökar vitt utrymme kunskapen med praktiskt taget 20 %.Kapacitet att visa uppmaning (CTAs):Ibland är den tydligaste metoden för att få något att skilja sig åt att göra saker större. Vi kan göra bilder större eller knappar större. Icke desto mindre kan det vara lika lönsamt att omfatta saken med blanksteg.En ren webbplats motsvarar en anmärkningsvärd webbplats:Vår sidas första känsla spelar stor roll. En ton extraordinärt stark design, en stor variation av planer - detta stora antal komponenter bidrar till intrycket en webbplats gör; dock är blanksteg särskilt betydelsefull eftersom den visar konstfullhet och fyndighet. Whitespace gör inte din webbplats exponerad eller moderat. Hur långa blanksteg än används på rätt sätt, kommer det att lägga till en känsla av polering och prevalens till din webbplats.Att skapa jämvikt:För lite blanksteg leder till oordning, oordning och skakningar – egenskaper du inte behöver relaterade till din webbplats image. Återigen kan många blanksteg innehålla en frånvaro av innehåll och en frånvaro av klientriktning. Nyckeln är att justera dina planer och låta whitespace fungera som ett otroligt instrument för att isolera klumpar av innehåll för enkel öppenhet och en vidareutvecklad kundupplevelse.Fungerar som en separator:Whitespace isolerar irrelevanta komponenter i en plan. Det brukar användas för att isolera bilder eller mönster från varandra och fungerar på ditt allmänna visuella format. Användningen av legitima blanksteg ger en tydligare överensstämmelse mellan tankar och övertygande planer.

Varför är blanksteg viktigt?

Whitespace är den grundläggande byggstenen för bra design, enligt mig som designer. Designers hänvisar till negativt utrymme, eller utrymmet mellan bitar i en komposition, när de använder termen 'whitespace'. Det är det tomma utrymmet mellan grafik, marginaler och rännor på en sida som inte har markerats med någonting. Ögat ges en visuell andningsområde av utrymmet mellan kolumner, textrader och figurer.

Det finns en övertygande anledning till varför blanksteg är en avgörande komponent i design. Det kan revolutionera utformningen av vår webbplats och ge den flera fördelar om den tillämpas på rätt sätt. Vi måste ta fram och skapa layouter som är tilltalande för ögat och som uppmuntrar läsarna att fortsätta. Det är viktigt att ständigt ha i åtanke att det är vår prioritet att leverera en fantastisk produkt till våra kunder när vi designar för webben.

Whitespace kan användas för att vägleda en läsare från ett element till ett annat, skapa harmoni och balans och hjälpa till att skapa en design. Våra huvudmål är att få webbplatsen att framstå som enkel och tydlig och att tillhandahålla innehåll som våra användare kommer att gilla och värdesätta. Whitespace är inte bara ett 'tomt' utrymme; det är en designfunktion som gör det möjligt för objekten på sidan att existera. Området uppnår en balans och fungerar som en ständig påminnelse om att vackra mönster finns. För att förmedla ett tydligt budskap behöver vi inte göra en layout som är överbelastad med text och grafik.