Text formatting: Difference between revisions
From The Birdhouse
mNo edit summary |
mNo edit summary |
||
Line 21: | Line 21: | ||
<span class="minecraft">minecraft</span> | <span class="minecraft">minecraft</span> | ||
< | <div class="center">center (must be inside a div, not a span)</div> | ||
<span class="bold">bold</span> <span class="italic">italic</span> <span class="underline">underline</span> <span class="white darkbg">darkbg</span> | <span class="bold">bold</span> <span class="italic">italic</span> <span class="underline">underline</span> <span class="white darkbg">darkbg</span> |
Revision as of 02:28, 25 August 2024
With some basic HTML, you can use custom Minecraft colors on pages!
HTML tags
To start, you surround the text you want with span tags. Like this: <span>YOUR TEXT HERE</span>
In HTML, <tags> are given in brackets, and their equivalent ending </tags> are placed at the end, with a slash to denote that it's the end. The span tags above are saying, "I want certain things to happen in the span between the tags."
But nothing will happen if you don't specify what you want! You need to give the tag some classes: <span class="CLASSES GO HERE">TEXT</span>
Classes tell the website to render text a certain way. When you write a class in between the quotation marks, it finds the class in the CSS and applies it to whatever's in between the tags.
We can use this to give text some color or write things in the Minecraft font!
You can use multiple classes by putting a space in between them. For example, if I wanted purple text in the Minecraft font, I'd write <span class="minecraft lightpurple"></span>
List of classes
Here's a list of all the custom classes currently on the wiki. For the "darkbg" class, make sure to also add "white" or another light color so it's readable!
minecraft
bold italic underline darkbg
darkblue darkgreen darkaqua darkred darkpurple gold gray darkgray
blue green aqua red lightpurple yellow white
Special formatting
Typewriter effect
Make text appear letter by letter. Example: Amy Stall.
Add an ID called "typewriter" to a div or span and all the text inside will render this way. Note that you can only have one typewritten piece of text on a page, due to the way the script is coded.
<span id="typewriter">Your text here.</span>
You can apply classes to the same tag as the typewriter ID, but you can't do it to specific parts of typewritten text. For example, this won't work:
<span id="typewriter">Your <span class="blue">text</span> here.</span>
But this will:
<span class="blue" id="typewriter">Your text here.</span>