Tabbladruimte in plaats van meerdere niet-afbrekende spaties (' ')?

Tabbladruimte In Plaats Van Meerdere Niet Afbrekende Spaties Nbsp



Bij webontwikkeling worden de spaties toegevoegd in HTML-documenten door gebruik te maken van de '   ”entiteitscode die ook wel de niet-afbrekende spatie wordt genoemd. In sommige gevallen is het toevoegen van meerdere niet-afbrekende spaties in het document vereist, zoals tabruimte. Daarom meerdere “ ” entiteitscodes kunnen de codevolgorde en netheid van het document beïnvloeden.

Om deze problemen aan te pakken, zijn er verschillende andere manieren om meerdere niet-afbrekende spaties in het HTML-document op te nemen, zoals ' ”, “ 'elementen, CSS' marge-links ”, “ padding-links ” eigendommen, en nog veel meer.

Deze studie leert je:





Eerst zullen we een voorbeeld doorlopen dat implementeert '   ” om spaties in het HTML-document toe te voegen. Ga vervolgens geleidelijk door de illustraties om verschillende methoden te demonstreren om tabruimte toe te voegen.



Spaties toevoegen met ' ' entiteitscode in HTML?

Spaties toevoegen met '   ' op de HTML-pagina, volg de gegeven stappen:



  • Voeg een div-element toe en wijs het een klasse toe ' artikel ”.
  • Plaats daarna een '

    ” element voor de kop.

  • Voeg vervolgens de '

    ”-element om een ​​alinea toe te voegen. Aan het begin van de alinea worden de spaties toegevoegd door de entiteitscode aan te geven '   ”:

< div klas = 'artikel' >
< h2 > Kennis is macht < / h2 >
< p >     Kennis is macht betekent dat een ontwikkelde man volledige controle heeft over zijn leven door de kracht van kennis. < / p >
< / div >

U kunt zien dat de spaties aan het begin van de alinea met succes zijn toegevoegd:



Tabbladruimte toevoegen met behulp van het HTML-element ''?

De HTML “ ” is een inline element dat wordt gebruikt om een ​​deel van een document te markeren. In het lopende voorbeeld hebben we het -element toegevoegd met de ' tabblad ' ID kaart. Dit element is gestileerd in de CSS om ruimte te creëren:



< div klas = 'artikel' >
< h2 >Kennis is macht< / h2 >
< p > < span ID kaart = 'tabblad' >< / span > Kennis is macht betekent dat een geschoolde man volledige controle heeft over zijn leven door middel van kennis 's kracht.


Stijl “artikel” div

.artikel {
marge: automatisch;
breedte : 400px;
opvulling: 10px;
}

De ' .artikel ” wordt gebruikt om toegang te krijgen tot de “

”-tags, die vervolgens worden toegepast met de volgende eigenschappen:

  • “ breedte ” eigenschap bepaalt de breedte van het element.
  • “ marge ” eigenschap bepaalt de hoogte van het element.
  • “ opvulling ” genereert ruimte rond de inhoud van het element.

Stijl 'tabblad' id

#tab {
opvulling links: 8px;
}

De ' #tab ' Toegang krijgen tot ' tabblad ” id van het -element en pas de “ padding-links eigendom erop.

Uitgang

Tabbladruimte toevoegen met behulp van het HTML-element '
'?

De ' ” element definieert de vooraf opgemaakte tekst. De tekst binnen het 

-element wordt weergegeven op de webpagina zoals deze is.


  Bekijk het voorbeeld door eerst de HTML-pagina te maken:


    

  •   Voeg de '   
       ”-element om een ​​kop van niveau twee aan het document toe te voegen.
    • 

  •   Voeg vervolgens de '      ”-tag en geef inhoud op met de gewenste opmaak:
    • 

  <   h2   >HTML pretag<  /   h2   > 
  <   pre   > 
  functie productFunctie  (  p1, p2  )   { 
  retourneer p1 * p2; 
    }  
  <  /   pre   >
   Uitgang  

 


  Tabbladruimte toevoegen met CSS-eigenschap 'margin-left'?


  Tabbladruimte toevoegen met behulp van de CSS '   marge-links   ”-eigenschap, volgt u de verstrekte procedure:


    

  •   Voeg eerst een div-element toe aan het document en wijs het een klasse toe '   afbeeldingen   ”.
    • 

  •   Voeg binnen dit div-element nog twee div-elementen toe samen met klasse '   img-1   ' en '   img-2   respectievelijk.
    • 

  •   Elk van deze twee div-elementen bevat afbeeldingen die zijn gespecificeerd met behulp van de       ' label.
    • 

  •   Deze '       ”-tags zijn gekoppeld aan de “   src   ' en '   breedte   ” attributen. Het kenmerk 'src' specificeert de URL van de afbeelding en het kenmerk 'breedte' past de breedte van de afbeelding aan.
    • 



  Hier is de HTML-code van het hierboven besproken scenario:
  <   div    klas  =  'afbeeldingen'  > 
  <   div    klas  =  'img-1'  > 
  <   img    src  =  '/spring-images/marguerite-flower.jpg'   breedte  =  '250'  > 
  <  /   div   > 
  <   div    klas  =  'img-2'  > 
  <   img    src  =  '/spring-images/flower-ga8f105f1d_1920.jpg'   breedte  =  '250'  > 
  <  /   div   > 
  <  /   div   >
  De HTML-pagina ziet er als volgt uit: 

 


  Laten we naar de CSS-sectie gaan om meerdere spaties toe te voegen aan de '   img-2   ” klasse zonder meerdere niet-afbrekende spaties te gebruiken.


   Stijl “afbeeldingen” div 
  .afbeeldingen  { 
    breedte  : 500px; 
  marge: automatisch; 

  }

  De '   .afbeeldingen   ' wordt gebruikt om toegang te krijgen tot de HTML-div die de '   afbeeldingen   ' klas. De uitleg van de bovengenoemde eigenschappen is als volgt:


    

  •   “   breedte   ” eigenschap bepaalt de breedte van het element.
    • 

  •   “   marge   ” eigenschap bepaalt de ruimte rond de zijkanten van het element.
    • 



   Stijl “img-2” div  
  Ga naar het div-element met behulp van de '   .img-2   ”:
  .img-  2   { 
  marge-links: 30px; 

  }

  De '   marge-links   ” woning met een “   30px   ' waarde wordt toegepast op het HTML div-element met klasse '   img-2   ”. Deze eigenschap voegt 30px ruimte toe aan de linkerkant van het element.


  Hier laat het resultaat zien dat de tweede afbeelding wordt toegepast met wat ruimte aan het begin:


 


  We zijn verder gegaan met het toevoegen van tab-spaties in plaats van het gebruik van meerdere niet-afbrekende spaties '       ”.


  Conclusie


  In HTML is de '       Entiteitscode wordt vaak gebruikt om niet-afbrekende spatie in het document toe te voegen. Om te voorkomen dat deze entiteitscode meerdere keren wordt gebruikt, zijn er andere manieren om tabruimte in een document toe te voegen. Deze methoden omvatten het gebruik van HTML “      ”, “      'elementen, '   marge-links   ” eigendom, en nog veel meer. Deze blog heeft verschillende manieren genoemd die helpen om tabruimtes in het HTML-document toe te voegen in plaats van meerdere ' ' toe te voegen. entiteitscodes.

							
							

							
							

							

							

							  

								 Ander

Categorie

Populaire Berichten

Hoe MPlayer te installeren op Linux Mint 21

Hoe maak je een Discord-account aan?

HKEY_USERS | Een gebruikersprofiel afstemmen op mappen

Gebruik van de functie Vector Pop_Back() in C++

Hoe een vector in MATLAB te spiegelen

Strings declareren, initialiseren, afdrukken en kopiëren in C

Waarom zou een startup AWS gebruiken?

Hoe u uw Discord-video-achtergrond kunt wijzigen

Hoe horizontale en verticale ruimte tussen elementen in Tailwind toevoegen?

Wat is HTML DOM Element previousElementSibling Property in JavaScript

Wijzig de opdracht Standaard afbeeldingseditor gekoppeld aan bewerken in het rechtsklikmenu voor afbeeldingsbestanden - Winhelponline

Hoe UUID genereren in Node.js?

Hoe u een bestand kunt vinden in Linux

Hoe schoon te maken Installeer NVIDIA-stuurprogramma's op Ubuntu 22.04 LTS

Hoe stel ik een Kubernetes-cluster in op een AWS EC2-instantie?

Hoe kan ik Git-opdrachten droog uitvoeren?

Voorbeeld() Functie in R

Hoe u HAProxy kunt integreren met PfSense voor verbeterde netwerken

Wat zijn de beste AI-plagiaatcontroles om ChatGPT-inhoud te detecteren?

Wat is char-gegevenstype in C ++