Fatal编程技术网
  • html/
  • Html CSS3制作适合其li的薄型ul

Html CSS3制作适合其li的薄型ul

html css

Html CSS3制作适合其li的薄型ul,html,css,Html,Css,假设以下HTML5文档： <!doctype html> <html> <head><title>try</title> </head> <body> <h1>testing</h1> <ul id='ul_id'> <li id='li1_id'>one</li> <li id='li2_id'>somelonge

假设以下HTML5文档：

<!doctype html>
<html>
 <head><title>try</title>
 </head>
 <body>
  <h1>testing</h1>
  <ul id='ul_id'>
   <li id='li1_id'>one</li>
   <li id='li2_id'>somelongertwo</li>
  </ul>
</body></html>


尝试
测试

    
一个
两个人
CSS3样式表是什么，使得
元素的宽度最小，所以这里
    • 的宽度加上它的项目符号，因为第二个列表项是
    元素中最宽的项

    我不希望我的
    的宽度与包含

    这个问题的背景和动机是我的问题

    CSS3样式表是什么，以便
    元素的宽度最小

    您可以将
    ul
    元素的
    显示更改为
    内联块
    
这样做时，它的宽度将基于子元素的大小
    
根据正常流程中
    内联块
    元件的相关规范：
    
如果
    width
    为
    auto
    ，则使用的值为浮动元素的宽度
    


    \ul\u id{
显示：内联块；
背景色：#f00；
}
    

      
一个
两个人

    
或
    
这两种方法中的一种应该如预期的那样起作用。
宽度调整以适应容器是由
    display:block
    行为引起的，这是
    ul
    元素的默认行为
    

    #ul_id {
   display: inline-block;
}

    

    #ul_id {
   float: left;
}
#ul_id:after {
   clear: both;
}