Html 是否可以显示一半的？_Html_Css_Web

Html 是否可以显示一半的？

html css web

Html 是否可以显示一半的？,html,css,web,Html,Css,Web,使用+：使用+：是否可以显示一半的屏幕？你可以这样写： ul { border:1px solid blue; width:230px; list-style: none; margin: 0; padding: 0; white-space:nowrap; font-size:0; } ul li { display:inline-block; *display:inline; /*For IE*/ *zoo

使用+：

是否可以显示一半的屏幕？你可以这样写：

ul {
    border:1px solid blue;
    width:230px;
    list-style: none;
    margin: 0;
    padding: 0;
    white-space:nowrap;
    font-size:0;
}
ul li {
    display:inline-block;
    *display:inline; /*For IE*/
    *zoom:1;
    white-space:noraml;
    font-size:16px;
    border:1px solid red;
    height:20px;
    display:inline;
    word-break:break-all;
}

选中此项

您可以这样写：

ul {
    border:1px solid blue;
    width:230px;
    list-style: none;
    margin: 0;
    padding: 0;
    white-space:nowrap;
    font-size:0;
}
ul li {
    display:inline-block;
    *display:inline; /*For IE*/
    *zoom:1;
    white-space:noraml;
    font-size:16px;
    border:1px solid red;
    height:20px;
    display:inline;
    word-break:break-all;
}

选中此项

从li中移除浮动：左侧

请注意，IE将只在空白字符处换行。

删除li中的float:left

请注意，IE将仅在空白字符处包装文本。

如果删除浮点：左；那么它应该会起作用

仅供参考，显示时不需要向左浮动：inline

如果移除浮动：左；那么它应该会起作用

仅供参考，显示时不需要向左浮动：inline

通过以下更改，它看起来像您的div和span示例：

html:

另请参见。

通过以下更改，它看起来像您的div和span示例：

html:

另请参见。

只需从ul li中取出float:left属性。但是，如果这样做，您可能会注意到每个li元素之间都有一点空间。这是因为HTML在li标记之间有一些空格

要删除这些空格，可以执行以下操作之一：

删除HTML中的空格，这当然会影响源代码的可读性。或者，将父ul的字体大小设置为0。然后，将字体大小属性添加到li。只需从ulli中取出float:left属性。但是，如果这样做，您可能会注意到每个li元素之间都有一点空间。这是因为HTML在li标记之间有一些空格

要删除这些空格，可以执行以下操作之一：

删除HTML中的空格，这当然会影响源代码的可读性。或者，将父ul的字体大小设置为0。然后，将字体大小属性添加到li。

哪一半？上，左。。。？小提琴根本不清楚你想要什么。@Lister先生-我想他想让li绕到下一行，就像它绕跨度一样。看看12345是如何在一条线上，67890是如何在另一条线上，但那个序列都是同一跨度的一部分。@jmort253哦。。。我想我必须启动更多的浏览器。哪一半？上，左。。。？小提琴根本不清楚你想要什么。@Lister先生-我想他想让li绕到下一行，就像它绕跨度一样。看看12345是如何在一条线上，67890是如何在另一条线上，但那个序列都是同一跨度的一部分。@jmort253哦。。。我想我必须启动更多的浏览器了！我从JSFIDLE中添加了代码。在你的答案正文中添加代码会使它更强大——以防链接断开——也会帮助你获得更多的投票+我回答得很好！我从JSFIDLE中添加了代码。在你的答案正文中添加代码会使它更强大——以防链接断开——也会帮助你获得更多的投票仅供参考，这看起来不像op的span示例中那样包装。相反，这些数字似乎超出了边界，但仍然没有换行到下一行。不确定这是op想要的还是我误解了。另外，仅供参考，本示例将显示设置为内联块，然后再返回内联，因为您忘记删除底部的块。仅供参考，这看起来不像op的span示例中那样包装。相反，这些数字似乎超出了边界，但仍然没有换行到下一行。不确定这是op想要的还是我误解了。同样仅供参考，此示例将显示设置为inline block，然后再设置为inline，因为您忘记删除底部的显示。

ul{
    border:1px solid blue;
    width:230px;
    overflow:hidden;
    list-style: none;
    margin: 0;
    padding: 0;
}
ul li{
    /*float:left;*/
    border:1px solid red;
    height:20px;
    display:inline;
    word-break:break-all;
}

ul{
    border:1px solid blue;
    width:230px;
    overflow:hidden;
    list-style: none;
    margin: 0;a
    padding: 0;
}
ul li{
    border:1px solid red;
    height:20px;
    display:inline;
    word-break:break-all;
    word-break: break-all;
}

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <body>
  <ul>
    <li>1234567890</li>
    <li>1234567890</li>
    <li>1234567890</li>
  </ul>
 </body>
</html>

<ul>
    <li>1234567890</li><li>1234567890</li><li>1234567890</li>
</ul>

ul{
    border:     1px solid blue;
    width:      210px;
    list-style: none;
    margin:     0;
    padding:    0;
}
li{
    border:  1px solid red;
    height:  20px;
    display: inline;
}

<ul>
... <li>A</li>
... <li>B</li>
</ul>
<!-- "..." denotes the spaces I'm talking about -->