css 实现div宽度随内容自适应

WBOY
发布: 2016-06-01 09:53:24
原创
3465 人浏览过

我们可以使用CSS float来设置div宽度随内容自适应,即可让div默认100%自适应宽度变成宽从零开始自适应宽度效果,像span初始宽度一样随内容增加而增宽。

请看下面实例:

<code class="language-html"> 
 
 
<title>css 实现div宽度随内容自适应</title> 
<style> 
.case{ float:left;margin-right:30px;} 
</style> 
 
 
<div>未设置float内容一</div> 
<div>未设置float内容二</div> 
<div class="case">加float样式的内容三</div> 
<div class="case">对其加float样式的内容四</div> 
 
</code>
登录后复制

在线运行

注意:通过css对div设置float去掉了div默认全屏宽度样式,但一般要使用这样的从零开始自适应内容宽度的盒子,又不能使用float浮动样式时,通过我们使用span标签即可实现

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!