HTML/CSS/Text/text transform
Содержание
Set text-transform: capitalize for h2
<source lang="html4strict">
<!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></title> <style type="text/css"> h2 {
text-transform: capitalize;
} </style> </head> <body>
My Amazing Web Site
Contact Form
<form id="form1" name="form1" method="post" action="/">
<label for="fmtitle" accesskey="i">Title</label>
<select name="fmtitle" id="fmtitle">
<option value="ms">Ms.</option>
<option value="mrs">Mrs.</option>
<option value="miss">Miss</option>
<option value="mr">Mr.</option>
</select>
<label for="fmname" accesskey="n">Name</label> <input type="text" name="fmname" id="fmname" /> <label for="fmemail" accesskey="e">Email</label> <input type="text" name="fmemail" id="fmemail" /> <label for="fmstate" accesskey="a">State/Province</label> <input type="text" name="fmstate" id="fmstate" /> <label for="fmstate" accesskey="y">Country</label> <input type="text" name="fmcountry" id="fmcountry" /> <label for="fmmsg">Message</label> <textarea name="fmmsg" accesskey="m" id="fmmsg" rows="5" cols="14"></textarea> <input type="submit" name="submit" value="send" class="submit" /> </form>
quid pro quo
</body> </html>
</source>
Set text transform to uppercase
<source lang="html4strict">
<!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" lang="en">
<head> <title></title>
<style type="text/css"> body {
background-image: url(bkgd2.jpg); background-position: -125px 75px; margin: 75px 75px 0 375px;
} h1, h2, h3 {
padding-top: 0; margin-top: 0; text-transform: uppercase;
} </style>
</head> <body>
Header 1
Header 2
Header 3
</body>
</html>
</source>
You can control the case of text using CSS: Apply the text-transform Property
<source lang="html4strict">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head> <title>text-transform</title> <style rel="stylesheet" type="text/css">
p {
padding: 5px 25px; background: mistyrose; border: 1px solid orange;
} span.lower {
text-transform: lowercase; background: pink;
} span.upper {
text-transform: uppercase; background: pink;
} span.capitalize {
text-transform: capitalize; background: pink;
}
</style> </head> <body>
UPPERCASE TEXT LOWERCASE lowercase text uppercase, capitalize every word in a sentence.
</p> </body>
</html>
</source>