2つのdivを水平にコードを並べます

1184 ワード

2つのdiv水平配列コード:divはブロックレベル要素であり、デフォルトでは各ブロックレベル要素が1行を独占するため、2つのdiv要素を水平に配列させるにはCSS設定を行う必要があります.次に、2つのdiv水平配列効果を実現する方法について説明します.
<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8"> 
<meta name="author" content="http://www.softwhy.com/" /> 
<title>    </title> 
<style type="text/css">
#left{
  width:100px;
  height:30px;
  text-align:center;
  line-height:30px;
  float:left;
  background:red;
}
#right{
  width:100px;
  height:30px;
  text-align:center;
  line-height:30px;
  float:left;
  background:blue;
}
</style>
</head>  
<body>
<div id="left">     </div>
<div id="right">     </div>
</body>  
</html>

フローティングを使用して水平配置効果を実現しましたが、フローティングを使用するには必ずフローティングをクリアする必要があります.具体的には、CSSがフローティングをクリアする方法とメリットとデメリットを参照してください.
原文の住所は次のとおりです.http://www.softwhy.com/forum.php?mod=viewthread&tid=11763
詳細については、次の項目を参照してください.http://www.softwhy.com/divcss/