如何设置div的宽度恰好是其中单词的宽度
this is the demo :http://jsfiddle.net/KwYjr/10/
how to set the blue div's width is Exactly the width of the word
thanks
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(6)
CSS:
css:
考虑使用
。它们没有自己的格式,因此应该可以帮助您换行或进行任何您正在尝试的操作。
编辑:跨度是执行“内联”操作的最佳/默认方式。 div 默认是块元素。
Consider using
<span>
. they have no formatting of their own and so should help you wrap or whatever you're trying.EDIT : span's are the best/default way to do "inline" stuff. div's are by default block elements.
将 div 设置为内联显示将使 div 具有精确的宽度:
但是,通过在示例上尝试此操作,可拖动面板会向左和向右移动。如果你仍然想保持相同的上下运动,你应该将其包装在另一个 div 中,然后将内联 div 放入其中,如下所示:
setting the div to display inline will make the div the exact width:
however, from trying this out on your sample the draggable panel then goes left and right. if you still want to maintain the same up down motion you should wrap it in another div and then put the inline div inside it like:
我更新了你的小提琴来演示答案。
I updated your Fiddle to demonstrate the answers.
我不知道如何获取单词的宽度,但您可以做的是为字母设置固定大小,这将很容易地获得每个字母的宽度,然后为您提供单词的宽度。然后,用 Javascript 测量 div 的宽度:
这是你想要做的吗?
I don't know how to get the width of a word, but what you can do is set a fixed sized for letters, which will easily get you the width of every letter which then gives you the width of the words. Then, measure the div's width with Javascript:
Is that what you meant to do?
将宽度设置为自动
http://jsfiddle.net/ozzy/KwYjr/24/
或
< a href="http://jsfiddle.net/ozzy/KwYjr/25/" rel="nofollow">http://jsfiddle.net/ozzy/KwYjr/25/
Set width to auto
http://jsfiddle.net/ozzy/KwYjr/24/
or
http://jsfiddle.net/ozzy/KwYjr/25/