Mon, 2004-08-09 10:18
Are there ways in css to make text look better (like anti-aliased) when the font-size is big?
Thanks,
Susanne
Mon, 2004-08-09 20:58
#1
how to make big text look better
Anti-aliasing on text within a browser is purely down to the system. Mac OS X does it by default; Windows XP allows the option to turn it on (called ClearType... why they've deeply hidden this option I don't know!)
You can specify type-sizes in most measurements, with CSS. You can use inches, mm, pixels, ems, cm, points, picas, titled-units (such as small, large), percentage, and ex.
Ideally, we'd all use pixels. But IE won't allow for user-resizing of pixel specified type-sizes in CSS. If you are worried about this, then try percentage and ems.
As a quick guide to using type-sizes with CSS:
HTML:
<p id="example">Text Here...</p>
CSS:
p#example
{
font-size: 24px;
}
Tue, 2004-08-10 07:46
#2
thanks
Thanks for the help, but I was looking for something else. I found that you can fake a sort of anti-aliasing by making a blur:
In the <head> or in your stylesheet:
<style type="text/css">
.blur
{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 18px;
font-weight: 700;
color: #363636;
width:100%;
height: 24px;
padding-top:2px;}
</style>
in the body:
<div class="blur" style="filter: blur(color=#151178, Strength=2, direction=120);">text</div>
It looks a little better in IE but doesn't work in Mozilla. But well, it's more than nothing...
Tue, 2004-08-10 08:11
#3
how to make big text look better
That looks really awful on my set up.
The blur gives a ragged effect and looks worse than the plain text.
Tue, 2004-08-10 10:01
#4
oops?
Don't know how you see it, it worked for me on my pc with IE 6.0 and didn't do anything in Mozilla (so didn't look awfull either)....
Tue, 2004-08-10 10:11
#5
how to make big text look better
I have put a screen shot of the blur and standard image here
http://www.stunicholls.myby.co.uk/cssforum/text.jpg
The blurred image is on top and the 'standard' IE text is below.
Tue, 2004-08-10 10:17
#6
how to make big text look better
I suspect your pc is antialiasing for you. Otherwise the letter on the bottom would look terrible. I can try to reproduce this on my pc and show you what I would see if you tell me what typo you used?
Tue, 2004-08-10 11:15
#7
how to make big text look better
The font is verdana (as per your style sheet).
...and I have my display settings - 'Smooth edges of screen fonts' turned on.
I believe that this is the 'normal' setting and that most PC owners have this turned on. I can see no good reason to turn it off these days with the speed of modern display drivers.
Tue, 2004-08-10 12:09
#8
how to make big text look better
Thanks for your help. I found out that it is standard off on the windows 2000 machine I'm working on but standard switched on on windows xp. I'd better not use it anymore, since it really looks horrible when smooth edges is switched on.
greetings, Susanne
Tue, 2004-08-10 13:18
#9
how to make big text look better
Thanks for your help. I found out that it is standard off on the windows 2000 machine I'm working on but standard switched on on windows xp. I'd better not use it anymore, since it really looks horrible when smooth edges is switched on.
greetings, Susanne