本文介绍了如何在标题旁边放置按钮?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我认为使用 float: right;
可以解决这个问题,但它会使按钮出现在 div 之外.我该如何解决这个问题?
HTML
<h1>标题</h1><按钮>按钮</按钮>
CSS
#main {宽度:200px;边框:1px 黑色虚线;}h1{边距:0;}按钮 {浮动:对;}
解决方案
给你的 h1
display: inline-block
允许你的元素占据同一行...
#main {宽度:200px;边框:1px 黑色虚线;}h1{边距:0;显示:内联块;}按钮 {浮动:对;}
<h1>标题</h1><按钮>按钮</按钮>
I thought using float: right;
would fix this, but it makes the button appear outside of the div. How do I solve this?
HTML
<div id="main">
<h1>Title</h1> <button>Button</button>
</div>
CSS
#main {
width: 200px;
border: 1px dotted black;
}
h1 {
margin: 0;
}
button {
float: right;
}
解决方案
Give your h1
display: inline-block
to allow your elements to occupy the same row...
#main {
width: 200px;
border: 1px dotted black;
}
h1 {
margin: 0;
display: inline-block;
}
button {
float: right;
}
<div id="main">
<h1>Title</h1> <button>Button</button>
</div>
这篇关于如何在标题旁边放置按钮?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!