Span text-transform: uppercase; : span text « Tags « HTML / CSS






  1. HTML / CSS
  2. Tags
  3. span text

Span text-transform: uppercase;

     
?<!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" dir="ltr" lang="en-US"
  xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<title></title>
<style rel="stylesheet" type="text/css">

#header {
  background: url(images/top_bg.jpg) top left no-repeat;
  padding: 33px 0 0 0;
  text-align: center;
}

#logo {
  display: block;
}

#header span {
  font-family: "Times New Roman", Times, serif;
  font-size: 9px;
  color: #786B50;
  text-transform: uppercase;
  display: block;
  float: left;
  letter-spacing: 6px;
  width: 1000px;
  text-align: center;
}

#menu {
  width: 1000px;
  float: left;
  margin: 12px 0 1px 0;
  display: block;
  height: 26px; /
  height: 25px;
}

#menu li {
  display: inline;
  padding: 0 19px;
  line-height: 25px;
}

#menu a {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  color: #FCEACE;
  text-decoration: none;
}

</style>
</head>
<body>
  <div id="header">
    <span>title</span>
    <ul id="menu">
      <li><a href="#">Home</a></li>
      <li><a href="#">About our Hotel</a></li>
      <li><a href="#">Services</a></li>
      <li><a href="#">Photogallery</a></li>
      <li><a href="#">Testimonials</a></li>
      <li><a href="#">Locations</a></li>
      <li><a href="#">Contacts</a></li>
    </ul>
    <img src="images/image.jpg" alt="" width="1000" height="311" /><br />
  </div>

</body>

</html>








Related examples in the same category

1.Span text-align: center;
2.span text-decoration: underline;
3.span text-decoration: overline;
4.span text-decoration: line-through;
5.span text-decoration: blink;
6.span text-decoration: underline overline;
7.span text-decoration: underline line-through;
8.span text-decoration: overline line-through;
9.span text-transform: lowercase;
10.span text-transform: capitalize;
11.span vertical-align: text-top;
12.span vertical-align: text-bottom;
13.text-indent does not work on inline elements
14.When vertically aligning inline elements,the vertical-align property can be: top, middle, bottom, text-top, text-bottom.
15.Inline vertical-align: text-bottom
16.Inline vertical-align: text-top