css在div

时间:2015-08-05 18:27:08

标签: css html5

这看起来并不困难......我在div中只有三种类型的文本,我需要以精确的精确度放置它们。 fonttest3.css

h1 {
    font-size: 41px;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    text-align:left;
    float:left;
} 


h2 {
    font-size: 21px;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    text-align:left;
    float:left;
    color: #FF9980;
    margin-top: 40px; padding-top: 5px;
    text-indent: 10px; 
} 


h3 {
    clear: both;
    font-size: 14px;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;     
    color: #B5B3DA;  
    text-align:left;  
     vertical-align: 20px     
} 



#topright {
  width: 797px ;
  height: 141px;
        background-color: White;  
    float: left;
}




body {
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 12px;
        background-color: #000000;
}

fonttest3.html

<html lang="en">
<head>
  <meta charset="utf-8">

  <title>test</title>
  <meta name="description" content="test">
  <meta name="author" content="Algomeysa">

  <link rel="stylesheet" href="fonttester3.css">
</head>

<body>



<div id="topright">
<h1>SPACELY SPROCKETS</h1>&nbsp;&nbsp;&nbsp;&nbsp;<h2>INCORPORATED</h2>
<h3>Doing that thing we do since 2025 for residential, commercial, and institutional clients</H3>
</div>
<

</body>
</html>

这在Chrome和Firefox中运行得相当不错,但是我想要将底线向上移动一点,而使用vertical-align似乎让我无处可去。

但它在IE9中是可怕的,这让我觉得我应该使用一种完全不同的方法来格式化这个文本。有什么指针吗?

1 个答案:

答案 0 :(得分:0)

试试这个:

h1 {
    margin: 0 10px 0 0;
    font-size: 41px;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    text-align:left;
    float:left;
    line-height: 43px;
} 


h2 {
    margin: 0;
    font-size: 21px;
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    text-align:left;
    float:left;
    color: #FF9980;
    line-height: 43px;
}

希望这有助于你:)