Last update: February 15 2019
Of course, you want certain parts of your text to grab the attention. You have a few options available to do this:
Bold, Underline and Italic
Let’s start with: underline, bold or italic. In HTML the tags for this look like this: <U>, <B> en <I>. Can you guess which one belongs to which? I bet you can! Told you HTML would be simple.
So, let’s use this in our text:
<html>
<head>
<title>my own homepage</title>
</head>
<body background="images/background.gif"
bgcolor="#ffffe1" text="#808080" link="#ff9b6A" vlink="#ff0000">
<p>Nora Tol started offering webdesign services since the <u>middle of the 90s</u> with her
first company <i>Nora Tol Virtual Publishing</i> and, now, with her second company,
<i>ElNorado Productions</i></p>
<p><u>By growing demand</u>, she expanded her services with designing logos, hosting,
online marketing and even creating online content.</p>
<p>Take a look at her website for more information.<br /><b>Or get in touch</b>.</p>
</body>
</html>
As you can see, all of these tags require to be closed. Anything written in between these tags will appear either bold <b>, italic <i> or underlined <u>. For instance, the text in between <B> and </B> will be printed in bold.
BTW, you can also achieve a bold print using the STRONG-tag in HTML. Anything in between <strong> and </strong> will be printed bold. And the EM-tag (for “emphasis”) will also show a text italic (sample: <em>text</em>)
In case you need it, you can also strike texts, just like you might in Word. You’ll be using the STRIKE-tag for this. A great way to visibly <strike>correkt</strike>, uhm, correct something.
Scroll Text Horizontally
We actually use CSS in combination with JavaScript for this now. This usually works in more browsers.
With the MARQUEE-tag you can scroll text or images, or any other content, horizontally. This won’t work in all browsers. It looks like this to code:
<marquee>This text will scroll horizontally across your screen</marquee>
By default, the text will scroll from left to right. However, you can adjust many things:
<marquee bgcolor="#ff0000" width="50%">This text will scroll horizontally across your
screen</marquee>
The above code will make the marquee itself red (thanks to the BGCOLOR-attribute) and the width of the marquee will only take up half of the screen size. You can also change the direction of the text.
<marquee direction="right">This text will scroll horizontally across your screen</marquee>
With the DIRECTION-attribute, the text will not be scrolled from right to left. However, it will still disappear off the screen once is reaches the edges. If you want it to bounce, this is the setting you need:
<marquee behavior="alternate">This text will scroll horizontally across your
screen</marquee>
Lastly, let’s adjust the speed and how many times it should loop the scrolled text:
<marquee loop="2" scrolldelay="200">This text will scroll horizontally across your
screen</marquee>
With LOOP=2 we’ve limited the text to loop just twice. Then it will stop.
With SCROLLDELAY we’ve decreased the speed of the loop. The higher the number, the slower the scroll. It’s in milliseconds. The lower the number, the faster the scroll.
Blink Text
Another tag to create an effect, is the BLINK-tag.
We use CSS for this too now, in combination with JavaScript. This usually works in more browsers.
However, it would look like this when using the BLINK-tag. It won’t work in all browsers:
<blink>This text will blink</blink>
Usually browsers either support the BLINK- or the MARQUEE-tag.