multiple text effects in css?

[joemorris86]

Hey guys, I have this bit of css code and the text effects are defined at the top there. But is there a way to define multiple text effects. So say if i want one block of text to be size 1 in bold, is there a way so i can have a second bit of text size 2 in italic. Also if thats possible, when its in the css, how would I use it in the xhtml document ? Any help would be appreciated.

<style type="text/css">
body {
	background-color: #FFFFFF;
	color: #000000;
	font-family: verdana, sans-serif;
	font-weight: bold;
	font-size: small;
}

#Container {
	margin-left: auto;
	margin-right: auto;
	width: 325px;
	height: 333px;
	border: 1px #000000 solid;
	text-align: center;
	padding: 10px;
}
#FirstBox {
	text-align: left;
	width: 304px;
	height: 84px;
	background-color: #C0C0C0;
	border: 1px #000000 solid;
}
#SecondBox {
	text-align: left;
	width: 304px;
	height: 216px;
	border: 1px #000000 solid;
	background-color: #C0C0C0;
	margin-top: 7px;
}	
p {
	padding-left: 5px;
}
</style>

 

[hendrix]

.bold { font-weight: bold; font-size: 12px; }
.italic { font-style: italic; font-size: 13px; }

In your html, you can use:

<span class="bold">This is bold text</span>

I think that would be sufficient