De tag definieert subscripttekst. Sublineaire tekst heeft de helft van de hoogte en wordt onder de basislijn weergegeven. Interlineaire tekst kan worden gebruikt bij het schrijven van chemische formules, zoals H 2 O.
De tag specificeert superscripttekst. Superscript-tekst is de helft van de hoogte en wordt boven de basislijn weergegeven. Superscripttekst kan worden gebruikt bij het schrijven van voetnoten, zoals WWW.
Browser-ondersteuningTags worden door alle grote browsers ondersteund.
Verschillen tussen HTML- en XHTML-standaardattributenDe DTD-kolom geeft aan in welk documenttype het HTML 4.01/XHTML 1.0 DTD-attribuut is toegestaan. S=Strikt, T=Overgangs- en F=Frameset.
Tags ondersteunen de volgende standaardkenmerken:
| klas | klassenaam | Specificeert de klassenaam voor het element | STF |
| richt | rtl ltr |
Specificeert de tekstrichting voor inhoud in een element | STF |
| Identiteitskaart | identificatie | Specificeert een unieke identificatie voor een element | STF |
| lang | taal_code | Specificeert de taalcode voor de inhoud van het element | STF |
| stijl | stijl_definitie | Specificeert een inlinestijl voor een element | STF |
| titel | tekst | Geeft aanvullende informatie over een element aan | STF |
| xml:lang | taal_code | Definieert de taalcode voor elementinhoud in XHTML-documenten | STF |
Meer informatie over standaardattributen.
EvenementkenmerkenTags en ondersteuning voor de volgende gebeurtenisattributen:
| klik | script | Script gestart met een muisklik | STF |
| ondblklik | script | Dubbelklik op een script | STF |
| opmuisdown | script | Script dat wordt uitgevoerd wanneer de muisknop wordt ingedrukt | STF |
| bij muisbeweging | script | Script dat wordt uitgevoerd wanneer de muisaanwijzer wordt verplaatst | STF |
| opmuisuit | script | Script dat wordt uitgevoerd wanneer de muisaanwijzer buiten een element beweegt | STF |
| opmousover | script | Script wordt uitgevoerd wanneer de muisaanwijzer over een element beweegt | STF |
| opmuis omhoog | script | Script dat wordt uitgevoerd wanneer de muisknop wordt losgelaten | STF |
| op toets omlaag | script | Script wordt uitgevoerd bij toetsaanslag | STF |
| op toetsaanslag | script | Script wordt uitgevoerd wanneer een toets wordt ingedrukt en vervolgens losgelaten | STF |
| optoets | script | Script dat moet worden uitgevoerd wanneer de sleutel wordt losgelaten | STF |
Meer informatie over
De index ten opzichte van de tekst is de verplaatsing van tekens ten opzichte van de basislijn naar boven of beneden. Afhankelijk van de positieve of negatieve waarde van de offset wordt de index respectievelijk hoger of lager genoemd. Ze worden actief gebruikt in de wiskunde, natuurkunde, scheikunde en om meeteenheden aan te duiden. HTML biedt twee elementen voor het maken van een index: (uit het Engelse superscript) - superscript en (uit het Engelse subscript) - subscript. Tekst die in een van deze containers wordt geplaatst, wordt kleiner aangegeven dan de basistekst en wordt ten opzichte daarvan naar boven of beneden verschoven. Voorbeeld 1 laat zien hoe deze elementen en stijlen samen kunnen worden gebruikt om het uiterlijk van tekst te veranderen.
Voorbeeld 1: Een superscript en een subscript maken
Superscript en subscript .formula ( lettertypegrootte: 1,4em; /* Tekstgrootte formule */ ) sup, sub ( lettertype: cursief; /* Cursief */ kleur: rood; /* Rode kleur van tekens */ ) sub ( kleur: blauw; /* Blauwe kleur van tekens */ )
Karakteristieke vergelijking van een oppervlak van de tweede graad
λ3 - I1λ2 + I2λ - I3 = 0
In het voorbeeld verschijnen zowel subscript als superscript tegelijkertijd. Om de stijl van het indexlettertype te wijzigen, worden stijlen gebruikt die een uniform ontwerp vormen (Fig. 1).
Rijst. 1. Weergave van indexen na het toepassen van stijlen
Je kunt weigeren ze helemaal te gebruiken ten gunste van stijlen. Een analoog van deze elementen is de eigenschap Vertical-align, die ervoor zorgt dat de tekst over een bepaalde afstand verticaal wordt verschoven. In voorbeeld 2 is de waarde specifiek 0,8em voor het superscript en -0,5em voor het subscript. Em is een relatieve eenheid die gelijk is aan de grootte van het huidige lettertype. 0,5em geeft bijvoorbeeld aan dat de tekst met de helft van de lettergrootte moet worden verschoven.
Voorbeeld 2: Stijlen gebruiken om indexen te beheren
Superscript en subscript .formula ( lettertypegrootte: 1,6em; /* Tekstgrootte */ lettertypestijl: cursief; /* Cursieve stijl */ ) .sup, .sub ( lettertypestijl: normaal; /* Normale stijl * / lettergrootte: 0,6em; /* Indexgrootte */ kleur: rood; /* Superscript kleur */ verticaal uitlijnen: 0,8em;* Tekst omhoog verschuiven */ .sub ( kleur: blauw; /* Kleur subscript */ verticaal uitlijnen: -0.5em; /* Verplaats de tekst naar beneden */ )
Polynoom van graad n
f(x) = a0 + a1 x + ... + an-1 xn-1 + een xn
In het voorbeeld wordt de formule zelf vergroot weergegeven, de superscript-symbolen zijn rood en de onderste blauw (Fig. 2).
Sinds een aantal lessen zijn we steeds geavanceerder geworden met het opmaken van tekst met behulp van CSS, en deze keer leren we hoe we de hoofdletters van tekst kunnen veranderen. In dit opzicht openen trapsgewijze stijlbladen zeer ruime mogelijkheden voor ons, en om preciezer te zijn: we kunnen:
- Toon alle tekst in hoofdletters;
- Selecteer alle tekst in kleine letters;
- Zorg ervoor dat de eerste letter van elk woord met een hoofdletter begint.
‘Dit is natuurlijk allemaal goed, maar wanneer zou het nodig kunnen zijn?’ - vraag je. Laten we ons een situatie voorstellen waarin u alle menu-items in hoofdletters moet weergeven. Om dit te doen, is het niet nodig om ze te typen, inclusief de CapsLock-toets, of terwijl u de Shift-knop ingedrukt houdt. Het is voldoende om alle lijstitems in hoofdletters weer te geven door een overeenkomstige regel in het CSS-bestand te maken. En dit is slechts een van de vele mogelijke situaties.
text-transform-eigenschapWe zullen het geval van de tekst controleren met behulp van de eigenschap text-transform. Het heeft 4 hoofdwaarden: hoofdletters (hoofdletters), kleine letters (kleine letters), hoofdletters (hoofdletters voor elke eerste letter van het woord, andere waarden veranderen niet), geen (opmaak wordt niet toegepast) . Op het eerste gezicht lijkt dit allemaal misschien erg ingewikkeld voor je.
Het belangrijkste is dat je niet in paniek raakt... Maar in de praktijk is alles vrij eenvoudig, zoals je nu zult zien. Het belangrijkste is om de juiste selector te kiezen, omdat de waarden van de eigenschap text-transform worden overgenomen.
KapitaliserenAllereerst stel ik voor om alle tekst in hoofdletters te zetten, waarvoor we de volgende CSS-regel maken:
Body ( teksttransformatie: hoofdletters; )
In principe niets ingewikkelds, we gebruikten alleen de waarde in hoofdletters. Zoals ze zeggen, alles is intuïtief. Zo ziet het er in het echt uit:
Allemaal met een hoofdletter... Kleine letters - van toepassing op iedereen De volgende stap is om overal kleine letters toe te passen door het volgende te schrijven:
Body ( teksttransformatie: kleine letters; )
Zoals je waarschijnlijk al geraden hebt, zijn de twee betekenissen die we zojuist hebben ontmoet tot op zekere hoogte antoniemen. En in de onderstaande afbeelding ziet u het resultaat van de nieuw gecreëerde eigenschap.
Webpagina met kleine letters ingeschakeld We markeren de eerste letter van elk woord in hoofdletters Om dit te doen, hoeven we alleen maar de overeenkomstige waarde te gebruiken:
Body (teksttransformatie: hoofdlettergebruik; )
Ik weet niet hoe vaak je zo’n CSS-regel zult gebruiken, maar het kan geen kwaad om van een dergelijke mogelijkheid op de hoogte te zijn, vooral bij het oplossen van niet-triviale problemen. Het resultaat is te zien in de onderstaande afbeelding.
Tekst na het toepassen van hoofdletters Laten we tot slot even kijken naar de laatste waarde: geen. Zoals ik al zei, kan het worden gebruikt om de erfenis van een ouder ongedaan te maken. Laten we ons bijvoorbeeld voorstellen dat we alle voorgaande regels van kracht hebben, en voor alinea's moeten we ze annuleren. Hiervoor schrijven we het volgende:
P (teksttransformatie: geen; )
Ik durf ervan uit te gaan dat alles je duidelijk is, zo niet, stel dan je vragen in de reacties. En dat is alles voor mij. Ik hoop dat deze CSS-tutorial je heeft geholpen. Zo ja:
- Plaats dit artikel opnieuw op sociale netwerken, zodat meer mensen ervan kunnen profiteren;
- Schrijf je in voor mijn nieuwsbrief en mis geen nuttige en interessante blogposts.
Dit is waar ik geen afscheid van je neem. Bedankt voor uw aandacht en tot ziens in de volgende publicaties!
In de laatste videoles hebben we geleerd hoe we nieuwe informatie kunnen verwijderen en toevoegen aan een nieuwe versie van een HTML-document, terwijl we dit aan zoekmachines rapporteren en visueel markeren, zodat bezoekers de wijzigingen ook kunnen zien. Hiervoor hebben we del- en ins-tags gebruikt.
In deze video-tutorial gaan we verder met het onderwerp van het opmaken van tekst in een HTML-document. We zullen twee HTML-tags bekijken die het superscript en subscript van tekst aangeven.
De sup HTML-tag is het superscript van tekst in HTML.Een HTML-tag is ontworpen om het superscript van tekst in HTML aan te geven. In sommige website-onderwerpen zal deze tag eenvoudigweg onvervangbaar zijn. Als u bijvoorbeeld een website heeft of van plan bent, gerelateerd aan formules, wiskundig of chemisch. Of, als u een bouwgerelateerde site heeft, dan zal de tag erg handig zijn en helpen bij het opmaken van artikelen, bij het schrijven van formules of hoeveelheden, bijvoorbeeld vierkante meters in bouwonderwerpen.
Maar als uw site geen betrekking heeft op de genoemde onderwerpen, betekent dit niet dat de tag niet nuttig zal zijn. Het is voldoende om verbeeldingskracht en vindingrijkheid te tonen en een toepassing voor dit element te vinden.
HTML-subtag is een subscript van tekst in HTML.De HTML-tag is het tegenovergestelde van de tag en is verantwoordelijk voor het aangeven van het subscript van de tekst. Subscripttekst kan worden gebruikt bij het schrijven van formules of wiskundige vergelijkingen. Maar daarnaast kunt u misschien nog andere toepassingen voor de tag vinden.
De volgende videoles is gewijd aan nog twee tags, die in sommige situaties eenvoudigweg onvervangbaar kunnen zijn. Bovendien zijn ze niet alleen in staat om tekst op te maken, bijvoorbeeld in een artikel, maar ook om verschillende informatie op de site aan te geven tijdens de pagina-indeling. Eén van de tags voert de vertaling naar HTML uit en de tweede tekent een horizontale lijn.
Converteer kleine letters naar kleine letters en eerste hoofdletters met behulp van CSS(8)
Er is geen cap-clausuleoptie in CSS. Andere antwoorden die teksttransformatie suggereren: hoofdlettergebruik zijn onjuist omdat deze optie gebruikmaakt van elk woord voor elk woord .
Hier brutaal Een manier om dit te doen is als je wilt dat de eerste letter van elk element een hoofdletter is, maar dat is zeker niet in de buurt van de werkelijke limiet:
P ( teksttransformatie: kleine letters; ) p:eerste letter ( teksttransformatie: hoofdletters; )
DIT IS EEN VOORBEELDZIN.
DIT IS NOG EEN VOORBEELDZIN.
EN DIT IS EEN ANDERE, MAAR HET ZAL VOLLEDIG IN KLEINE LETTERS ZIJN.
Hoe kan ik de letter HOOFDLETTERS omzetten in kleine letters en de eerste letter van een hoofdletter voor elke zin, zoals hieronder weergegeven, met alleen CSS?
Uit: DIT IS EEN VOORBEELDTOEPASSING.
Aan: Dit is een geschatte zin.
Update: wanneer ik text-transform gebruik: capize; Het resultaat is nog steeds hetzelfde.
Je kunt dit niet alleen met CSS doen. Er is een text-transform attribuut, maar het accepteert alleen geen, hoofdletters, hoofdletters, kleine letters en erven.
Misschien wilt u een JS-oplossing of een server-side oplossing bekijken.
Als u op de server alle tekens in kleine letters kunt maken, kunt u het volgende toepassen:
Teksttransformatie: hoofdlettergebruik
Ik denk niet dat teksttransformatie zal werken met hoofdletters als invoer.
Als je dit wilt gebruiken, werkt dit niet, voor of textarea moet je Javascript gebruiken
function capitaliseName() ( var str = document.getElementById("name").value; document.getElementById("name").value = str.charAt(0).toUpperCase() + str.slice(1); )
