For example, in one line there will be 2 different fonts for different words.
i.e
(typeworthy) This is a (helvetica) test
Typeworthy being on 'This is a' and helvetica being on 'test'. Not sure how to do this though - I've tried using different div classes but that puts the words on different lines.
Can this be done?
Update:
view:
<span class="font1">We</span> <span class="font2">LOVE</span>
<span class="font3">Flappy Bird</span><span class="fontone">so much<div id="space">we made <span class="fonttwo">FLAPPY</span>, the toy game controller!</span></div>
css:
.font1{
font-family: 'boxyfont';
text-shadow: -1px -1px white, -1px 1px white, 2px -1px white, -1px -1px white;
margin-top:10px;
display:block;
float:left;
}
.font2{
font-family: 'noteworthy';
padding: 4px 10px 4px 10px;
color: white;
font-weight: bold;
text-shadow: 1px 0 black, 0 2px black, 2px 0 black, 0 -1px black;
margin-top:-10px;
}
Use a span:
<p>
<span class="typeworthy">This is a</span> <span class="helvetica">Test</span>
</p>
Then, configure the two classes on your css.
You might want to use the <em> instead, if the reason for the difference is to give emphasis.
Here try this fiddle
<div>
<span class="font1">Hello</span> <span class="font2">World</span> !
</div>
.font1{
font-family:serif;
}
.font2{
font-family:sans-serif;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With