Vad är en HTML -span -tagg?
Hyper Text Markup Language (HTML) är en specialiserad uppsättning datorkoder som används för att bestämma hur en webbsida visas. Varje element är taggat med en specifik kod så att webbläsaren visar texten på det sätt som taggaren har tänkt. Span -taggen indikeras av och används för att lägga till en krok till en specifik del av text.
HTML -span -taggen liknar den logiska divisionen, eller div taggen. Båda används med Cascading Style Sheets (CSS), ett språk som webbutvecklare använder för att tilldela stilegenskaper till HTML, XHTML och XML -webbdokument. Användningen av CSS möjliggör separering av innehållet från presentationselementen, såsom layout, teckensnitt och färg. Detta gör innehållet mer tillgängligt och presentation mer flexibelt.
HTML SPAN -taggen gör ingen aktiv ändring av den angivna texten, till skillnad från taggar som indikerar rubrikstorlek, stycke eller textfärg. Istället används denna tagg för att gruppera en del av HTML tillsammans och för att ansluta annan information till den delen. ThE html div -tagg fungerar på liknande sätt, men varje tagg tjänar ett annat syfte.
DIV -taggen delar upp en webbsida i stora avsnitt. Dess användning gör det möjligt för utvecklare att definiera stilen för en stor del av HTML -koden. Med DIV -taggen kommer förmågan att namnge de taggade avsnitten så att de enkelt kan hanteras i CSS. Observera att HTML DIV -taggen bryter stycken. Med andra ord kan du ha stycken inom ett avsnitt märkt med DIV, men du kanske inte har en div inuti ett stycke.
HTML SPAN -taggen liknar div -taggen eftersom den omsluter ett avsnitt av text. Utan stilattribut kommer den inte att ändra texten den har bifogat. kommer inte att göra någon formatering utan attributtaggar, där div innehåller pauser.
Tre användbara attribut som kan användas med HTML SPAN -taggen är stil, klass och ID. Genom att använda span kan ett specifikt attribut bifogas till en liten del text. För exOm en mening är skriven i en nivå 1 -rubrik och det sista ordet måste vara rött, kan HTML -span -taggen användas för att uppnå detta. Se exemplet nedan.
<![CDATA[ <h1> Detta ska vara rött </h1> </ xmp> </p>
<p> ger detta resultat: </p>
<p> <h1> detta ska vara rött </h1> </p>
<p> Genom att omsluta det önskade ordet med HTML SPAN -taggen är attributet - i detta fall färgröd - begränsat till det enskilda ordet som anges. Det bör noteras att HTML SPAN -taggen kan vara i punkt eller DIV -taggar. Som med alla HTML -taggar måste du stänga elementet för att det ska fungera ordentligt.
</p>
<section class="index-list">
<h4>ANDRA SPRÅK</h4>
<ul>
<li>
<a href="/en/internet/what-is-an-html-span-tag.html" hreflang="en" lang="en">
English</a></li>
<li>
<a href="/cs/internet/what-is-an-html-span-tag.html" hreflang="cs" lang="cs">
Čeština</a></li>
<li>
<a href="/da/internet/what-is-an-html-span-tag.html" hreflang="da" lang="da">
Dansk</a></li>
<li>
<a href="/de/internet/what-is-an-html-span-tag.html" hreflang="de" lang="de">
Deutsch</a></li>
<li>
<a href="/sv/internet/what-is-an-html-span-tag.html" hreflang="sv" lang="sv">
Svenska</a></li>
<li>
<a href="/fr/internet/what-is-an-html-span-tag.html" hreflang="fr" lang="fr">
Français</a></li>
<li>
<a href="/it/internet/what-is-an-html-span-tag.html" hreflang="it" lang="it">
Italiano</a></li>
<li>
<a href="/nl/internet/what-is-an-html-span-tag.html" hreflang="nl" lang="nl">
Nederlands</a></li>
<li>
<a href="/no/internet/what-is-an-html-span-tag.html" hreflang="no" lang="no">
Norsk</a></li>
<li>
<a href="/pl/internet/what-is-an-html-span-tag.html" hreflang="pl" lang="pl">
Polski</a></li>
<li>
<a href="/pt/internet/what-is-an-html-span-tag.html" hreflang="pt" lang="pt">
Português</a></li>
<li>
<a href="/es/internet/what-is-an-html-span-tag.html" hreflang="es" lang="es">
Español</a></li>
<li>
<a href="/ja/internet/what-is-an-html-span-tag.html" hreflang="ja" lang="ja">
日本語</a></li>
<li>
<a href="/ko/internet/what-is-an-html-span-tag.html" hreflang="ko" lang="ko">
한국어</a></li>
<li>
</ul>
</section>
</article>
<div class="articleRatings" data-article-url="https://www.helpleft.com/sv/internet/what-is-an-html-span-tag.html">
<span class="articleRatings-question">Hjälpte den här artikeln dig?</span>
<span class="articleRatings-feedback">
<span class="articleRatings-feedback-tick">
<svg height="20" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg">
<path d="m8 14a.997.997 0 0 1 -.707-.293l-2-2a.999.999 0 1 1 1.414-1.414l1.293 1.293 4.293-4.293a.999.999 0 1 1 1.414 1.414l-5 5a.997.997 0 0 1 -.707.293" fill="#2CC683" fill-rule="evenodd"></path>
</svg>
</span>
<span class="articleRatings-feedback-message">Tack för feedbacken</span>
</span>
<span class="articleRatings-failure">Tack för feedbacken</span>
<div class="articleRatings-actions">
<button class="rateAction rateAction--positive" data-rating="positive">
<span class="sr-only">Ja</span>
<span class="rating-face">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24">
<path fill-rule="evenodd" d="M5.538 14.026A19.392 19.392 0 0 1 12 12.923c2.26 0 4.432.388 6.462 1.103-1.087 2.61-3.571 4.436-6.462 4.436-2.891 0-5.375-1.825-6.462-4.436zm1.847-3.872a1.846 1.846 0 1 1 0-3.692 1.846 1.846 0 0 1 0 3.692zm9.23 0a1.846 1.846 0 1 1 0-3.692 1.846 1.846 0 0 1 0 3.692z"></path>
</svg>
</span>
</button>
<button class="rateAction rateAction--negative" data-rating="negative">
<span class="sr-only">Nej</span>
<span class="rating-face">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24">
<path fill-rule="evenodd" d="M7.385 13.846a1.846 1.846 0 1 1 0-3.692 1.846 1.846 0 0 1 0 3.692zm9.23 0a1.846 1.846 0 1 1 0-3.692 1.846 1.846 0 0 1 0 3.692zm-.967 4.95a.992.992 0 0 1-.615-.212c-1.701-1.349-4.364-1.349-6.065 0a.998.998 0 0 1-1.36-.123.895.895 0 0 1 .127-1.3A6.897 6.897 0 0 1 12 15.692c1.555 0 3.069.521 4.266 1.467.41.326.467.909.127 1.3a.982.982 0 0 1-.745.335z"></path>
</svg>
</span>
</button>
</div>
</div>
<section class="articleFoot">
<i class="icon-contact"></i>
<p class="help">
<a id="sbContact" href="#contactModal" data-toggle="modal" class="contactUs">Hur kan vi hjälpa?</a>
<a id="sbContactMobile" href="mailto:support@HelpLeft.com" class="contactUs">Hur kan vi hjälpa?</a>
</p>
<time class="lu">
<a href="https://www.facebook.com/sharer/sharer.php?u=https://www.helpleft.com/sv/internet/what-is-an-html-span-tag.html" target="_blank"><img src="/images/facebook.png"></a>
<a href="https://www.pinterest.com/pin/create/link/?url=https://www.helpleft.com/sv/internet/what-is-an-html-span-tag.html?utm_source=pinterest.com&utm_medium=social&utm_campaign=sunsetmag&media=https://www.helpleft.com/img/Surgery-2.jpg?itok=88aGvXqN&description=Vad är en HTML -span -tagg?" target="_blank"><img src="/images/pinterest.png"></a>
<a href="https://twitter.com/intent/tweet?text=Vad är en HTML -span -tagg?+https://www.helpleft.com/sv/internet/what-is-an-html-span-tag.html&via=HelpLeft" target="_blank"><img src="/images/twitter.png"></a>
<a href="https://share.flipboard.com/bookmarklet/popout?v=2&title=Vad är en HTML -span -tagg?&url=https://www.helpleft.com/sv/internet/what-is-an-html-span-tag.html" target="_blank"><img src="/images/flipboard.png"></a>
<a href="mailto:?subject=Vad är en HTML -span -tagg?&body=https://www.helpleft.com/sv/internet/what-is-an-html-span-tag.html" target="_blank"><img src="/images/e-mail.png"></a>
</time>
</section>
</div><!--/contentWrapper-->
<section class="related">
<h3>RELATERADE ARTIKLAR</h3>
<ul>
<li><a href="/sv/internet/how-do-i-choose-the-best-online-cooking-school.html">Hur väljer jag den bästa matlagningsskolan online?</a></li>
<li><a href="/sv/internet/what-should-i-consider-when-buying-wrist-supports-for-my-computer.html">Vad ska jag tänka på när jag köper handledsstöd för min dator?</a></li>
<li><a href="/sv/internet/what-is-an-internet-call-center.html">Vad är ett internet callcenter?</a></li>
<li><a href="/sv/internet/what-is-a-usenet-newsreader.html">Vad är en Usenet -nyhetsläsare?</a></li>
<li><a href="/sv/internet/what-is-a-wait-state.html">Vad är ett väntetillstånd?</a></li>
<li><a href="/sv/internet/how-do-i-remove-malware.html">Hur tar jag bort skadlig programvara?</a></li>
</ul>
</section>
</section><!--/content-->
<aside id="sidebar" class="span3">
<a name="categories"></a>
<div class="mobile-no">
<form action="/search.html" method="GET" id="searchBar" class="sm" autocomplete="off">
<input type="text" name="q" title="Sök" class="search-query" placeholder="Skriv din fråga..." value="" aria-label="Skriv din fråga...">
<button type="submit">
<span class="sr-only">Växla sökning</span>
<i class="icon-search"></i>
</button>
</form>
</div>
<ul class="nav nav-list">
<li ><a href="/sv/health-page-1.html">Hälsa</a></li>
<li ><a href="/sv/education-page-1.html">Utbildning</a></li>
<li ><a href="/sv/medicine-page-1.html">Medicin</a></li>
<li ><a href="/sv/science-page-1.html">Vetenskap</a></li>
<li ><a href="/sv/physiology-page-1.html">Fysiologi</a></li>
<li ><a href="/sv/finance-page-1.html">Finansiera</a></li>
<li ><a href="/sv/business-page-1.html">Företag</a></li>
<li ><a href="/sv/manufacturing-page-1.html">Tillverkning</a></li>
<li class='active'><a href="/sv/internet-page-1.html">Internet<i class='icon-arrow'></i></a></li>
<li ><a href="/sv/technology-page-1.html">Teknologi</a></li>
<li ><a href="/sv/miscellaneous-page-1.html">Övrigt</a></li>
<li><a href="/travel/sv/">Resa</a></li>
</ul>
</aside>
</div>
<footer>
<p>
<a href="/about.html">Om oss</a>
|
<a href="/terms-of-use.html">Användarvillkor</a>
|
<a href="/privacy-statement.html">Sekretesspolicy</a>
<br>
Copyright © <a href="/sv/">HelpLeft</a> All rights reserved.
</p>
</footer>
</section>
<section id="contactModal" class="modal hide" tabindex="-1">
<h2>Hur kan vi hjälpa?</h2>
<a href="#" id="closeBtn" data-dismiss="modal"><i
class="icon-close"></i></a>
<div class="modal-body">
<form data-parsley-validate novalidate method="post"
action="#" enctype="multipart/form-data"
class="form-horizontal contact">
<div class="control-group">
<label for="md-name" class="control-label">namn</label>
<div class="controls">
<input type="text" name="name" id="md-name"
placeholder="">
</div>
<!--/controls-->
</div>
<!--/control-group-->
<div class="control-group">
<label for="md-email" class="control-label">E-post</label>
<div class="controls">
<input type="email" name="email" id="md-email"
data-parsley-required="true" data-parsley-type="email"
data-parsley-notblank="true"
data-parsley-trigger="change"
data-parsley-required-message="Email is required">
<input type="text" name="phone" id="phone" value="">
</div>
<!--/controls-->
</div>
<!--/control-group-->
<!--/control-group-->
<div class="control-group">
<label for="md-message" class="control-label">Meddelande</label>
<div class="controls">
<textarea name="message" id="md-message" data-parsley-required="true"
data-parsley-notblank="true"
data-parsley-required-message="Message is required"></textarea>
</div>
<!--/controls-->
</div>
<!-- /control-group -->
<div class="form-actions">
<input type="submit" class="btn" value="Skicka">
</div>
<!--/form-actions-->
</form>
</div>
<!--/modal-body-->
</section>
<script src="/js/app.min.js"></script>
</body>
</html>
]]>