Click to See Complete Forum and Search --> : Changinf Text Style
Herrjosua
04-26-2005, 09:49 AM
I'm using CSS for the first time and I figured out how to change the text formatting for the whole page, but how would I change the text formatting for just one part? I need to change the formatting to links title.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Welcome to Howling Wolf Studios</title>
<script type="text/javascript">
<!--//
<style type="text/css">
<!--
body,td,th {
color: #FF0000;
}
body {
background-color: #000000;
}
a:link {
color: #FFFFFF;
}
a:visited {
color: #FFFFFF;
}
-->
</style></head>
<body>
<a href="mailto:jbock@howlingwolfstudios.net?Subject=Howling Wolf Studios" <u> Email me </u></a> any questions and/or suggestions.
<br>
<br>
Links
<hr />
<br>
</div>
<i>
- <a href="http://www.scad.edu" <u> Savannah College of Art & Design </u></a>
<br>
<br>
- <a href="http://www.highend3d.com" <u> Highend 3d </u></a> is where you can find shaders, textures and tutorials on most of todays 3d programs.
<br>
<br>
- <a href="http://www.pbase.com/ocelaridhighlan" <u> Pbase </u></a> is my personal web gallary of photographs.
</i>
</body>
</html>
You may use classes or ids
<style type="text/css">
.myclass {
color:'#CCCCCC';
}
#myid {
color:'#FF0000';
}
</style>
...
<body>
<span id="myid">this text has #FF0000 color</span>
<table>
<tbody>
<tr>
<td class="myclass">this text has #CCCCCC color</td>
</tr>
</tbody>
</table>
You may also use combination of tag/class/id (in so called pseudo-classes) but first learn how to use the simple methods
Herrjosua
04-26-2005, 11:45 AM
Thanks, is that how I would also change the font size, and font style too?
Learn CSS
http://www.w3schools.com/css/default.asp
ffurnai
04-27-2005, 09:04 AM
Yes, that is how you would change the font and font size.
to add to Kor's code. . .
.myclass {
color:#CCC;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: .8em;
}
note:
I used the em value for the font-size as it bases the relative font size on the size chosen by the user in their browser as the default size. You can use px as a measure but it is not recommended
You can use px as a measure but it is not recommended
Really? How's that? If px are the common measures and browser's resolution is in pixels... what makes u say that? Argues?
Pixel units are relative to the resolution of the viewing device... With this in mind, .px may be the most portable unit of measure across devices. Absolute length units are only useful when the physical properties of the output medium are known.
ray326
04-27-2005, 07:51 PM
Some browsers will not resize text set in px units, thereby making the content less accessible. That's the main argument against px sizing.
Some browsers will not resize text set in px units, thereby making the content less accessible.
The main browsers do that. So that the chances that a user who needs to resize the fonts to have such an old broswser are very very poor.
On the other hand, from a designer point of view, as, let's say, a graphic program such as Photoshop, has low posibilities to use em instead of px.
Considering the disadvantages and the low chances argued above, I guess that there are no serious resons to use em intead of px.
ffurnai
04-28-2005, 09:21 AM
On the other hand, from a designer point of view, as, let's say, a graphic program such as Photoshop, has low posibilities to use em instead of px.
I was only refering to font-size for em. By all means use px for every image, margin, border, padding value. But why not let the user's browser settings determine what they want as their base size?
To each his own variety is the spice of life. :)
Herrjosua, ultimately its up to you. Just trying to offer some advice.
You might be rigth, following your point of view. On the other hand, the whole page is build following all the elements' size balance, so that if using em for fonts most of the time the whole page construction will be up sided down...
ray326
04-28-2005, 01:37 PM
The main browsers do that.Really? The main one that didn't used to do it was IE. It would not resize px-dimensioned text.
Yea, I see now that even if it has resize text option, it woun't work... It remanis than as the only solution the change of the display's resolution... After all you might be right... Even so, I guess that if you build you pages in normal standard way, there must have not be any problems, even if the text is px sized. Any way, tx for you have pointed out this matter, I should think of it when building pages which might have target people who might need resizing the text...