Hvordan måle ASCII tegnbredde

Hvordan måle ASCII tegnbredde


ASCII-tegnsett, opprettet i 1960, består av alle tegnene på tastaturet. Når utviklere bygge nettsteder, de bruker disse tegnene for å lage teksten som vises på websider. At teksten varierer i størrelse i henhold til skriften som brukes og størrelsen på skriften. Dersom man har behov for å vite en ASCII tegn bredde, bruke HTML "offsetWidth" eiendom for å fastslå denne verdien.

Bruksanvisning

1 Opprett en ny HTML-dokument eller åpne et eksisterende.

2 Legg denne koden til dokumentets "body" -delen:

<Span id = "liten" class = "asciiSmall">

A </ span>

<Input type = "button" value = "Få Bredde Small" onclick = "return getWidth (" små ")" />

<Span id = "stort" class = "asciiLarge">

A </ span>

<Input type = "button" value = "Få Bredde Large" onclick = "return getWidth ( 'store')" />

Dette skaper to "span" tags. Den første refererer til en CSS-klasse som heter "asciiSmall." Den andre span refererer til en CSS-klasse som heter "asciiLarge." En knapp vises under hver span. Den knappen kaller Javascript-funksjonen som får span bredde. Hver span inneholder bokstaven «A» Endre det til alle tegn du vil.

3 Legg denne CSS-koden til dokumentets "head" -seksjonen:

<Style type = "text / css">

.asciiSmall {font-size: 10px;}

.asciiLarge {font-size: 20px;}

</ Style>

Den "asciiSmall" class setter skriftstørrelsen for et element som refererer klassen til 10 piksler. Den "asciiLarge" klasse setter den til 20 piksler. De to span elementer beskrevet i trinn 1 og 2 vil vise disse skriftstørrelser fordi de refererer til disse to klassene.

4 Lim inn følgende kode i dokumentet "head" -seksjonen etter at CSS-koden som vises i trinn 3:

<Script type = "text / javascript">

funksjon getWidth (objectID) {

Var asciiCharacter = document.getElementById (objectID);

Var asciiWidth = asciiCharacter.offsetWidth;

alert ( "ASCII tegn =" + asciiCharacter.innerHTML + "width =" + asciiWidth);

tilbake asciiWidth;

}

</ Script>

Denne funksjonen henter "ID" i spennet gikk forbi en av knapp klikk. Den henter deretter span "offsetWidth" eiendom. At eiendommen inneholder span bredde. Fordi span elementer kontrakt for å passe deres innhold, lik "offsetWidth" verdi bredden på span innhold. Siden hvert spenn inneholder bokstaven "A" de "offsetWidth" -verdien inneholder verdien av bokstaven «A»

Hint

  • Du kan også måle bredden på en streng av ASCII-tegn ved å erstatte bokstaven "A" med en tegnstreng, setning eller avsnitt.