<![CDATA[武冈论坛官方博客]]> http://blog.wugangbbs.com/index.php zh-cn http://blog.wugangbbs.com/post// <![CDATA[块转换内联，内联转换为块]]> admin <admin@yourname.com> Tue, 02 Feb 2010 18:07:39 +0000 http://blog.wugangbbs.com/post//
IE6下不支持  可以模拟。

<!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>
<style type="text/css">
<!--
.nav {
  MARGIN: 0px;
  WIDTH: 100%;
  FONT-FAMILY: verdana;
  HEIGHT: 24px;
  font-family:Arial, Helvetica, sans-serif;
    LINE-HEIGHT: 24px;
}
.nav UL {
  PADDING: 0px;
  DISPLAY: block;
  MARGIN: 0px;
  LIST-STYLE-TYPE: none;
  HEIGHT: 24px;
  BACKGROUND-COLOR: #c5dbf2;
  COLOR: #ffffff;
text-align:center;
}
.nav LI {
  DISPLAY: inline-block;
  *display:inline;*zoom:1;
  HEIGHT: 24px;
  font-family:Arial, Helvetica, sans-serif;
    LINE-HEIGHT: 24px;
  WIDTH: 82px;
  text-align:center;
}
.nav LI A {
  PADDING:1px 15px 0;
  DISPLAY: block;
  FONT-WEIGHT: none;
  COLOR: #000;
  LINE-HEIGHT: 24px;
  TEXT-DECORATION: none;
}
.nav LI A:hover {
  COLOR:#562505;
  BACKGROUND-COLOR: #2687eb;
  TEXT-DECORATION: none;
}
-->
</style>
</head>
<body>
<DIV class="nav">
  <UL>
    <LI><A href="{$InstallDir}Department/ShowClass.asp?ClassID=154" >文 秘</A></LI>
    <LI><A href="{$InstallDir}Department/ShowClass.asp?ClassID=155" >接 待</A> </LI>
    <LI><a href="{$InstallDir}Department/ShowClass.asp?ClassID=156" >信 息</a> </LI>
    <LI><A href="{$InstallDir}Department/ShowClass.asp?ClassID=157" >通 信</A> </LI>
    <LI><A href="{$InstallDir}Department/ShowClass.asp?ClassID=158" >治 安</A> </LI>
    <LI><A href="{$InstallDir}Department/ShowClass.asp?ClassID=159" >档 案</A> </LI>
    <LI><A href="{$InstallDir}Department/ShowClass.asp?ClassID=160" >后 勤</A> </LI>
  </UL>
</DIV>
</body>
</html>



块转换内联盒子的话，display:inline;zoom:1;
display是转换了内联了，但是他里面也包块，块是会换行的，所以内联里面控制不了块，必须zoom 激发IE的HS属性，这样就模拟出内联盒子了，可以包含块了。

内联转内联盒子，很容易，直接 inline-block  激发了 HS
]]> http://blog.wugangbbs.com/post//#blogcomment <![CDATA[[评论] 块转换内联，内联转换为块]]> <user@domain.com> Thu, 01 Jan 1970 00:00:00 +0000 http://blog.wugangbbs.com/post//#blogcomment