你好,
我想使用 css3 样式创建自己的选择框。我正在使用 1 个输入字段和一个向下箭头。总选择框在 1 个外部 div 中,图像在内部标记中。我必须将该向下箭头定位到最右边的外部 div,以便它看起来像选择框。我在对齐该图像时遇到问题。我可以通过将 position:absolute 用于内部和外部标签来定位该标签。如果我不将 position:absolute 用于外部 div 标签,则内部 div 标签定位不正确。
但问题是,如果我这样设置,我必须为每个选择框指定左侧和顶部(手动对齐)。如果我的申请表中有多个选择框,很难做到这一点。 (事实上 ,它令人作呕......)..所以内部div标签必须最右对齐到外部标签而不定位外部div标签......我希望我清楚......请帮助解决这个问题..
这是我的示例代码......
<!DOCTYPE HTML>
<html>
<head>
<style>
#Outer{ width:155px; height:20px; *position:absolute; border:1px solid #336633; }
#In{ position:absolute; right:0px; height:100%; width:10px; background:red; top:0px; }
</style>
</head>
<body>
<div id="Outer">
<input type="text"/>
<div id="In">^</div>
</div>
</body>
</html>
最佳答案
我认为以下代码符合您的目的。
<head>
<style>
#Outer{
float:left;
width:200px;
height:20px;
border:1px solid #336633;
}
#In{
float:left;
height:100%;
width:10px;
background:red;
}
</style>
</head>
<body>
<div id="Outer">
<div style="float:left"><input type="text"/></div>
<div id="In">^</div>
</div>
</body>
在上面的代码中,我为您的输入元素添加了一个 div,并在外部和内部 div 中添加了 float 样式。还有一点,你的宽度应该大于155px,我用的是200px。
请告诉我它是否有效,或者您还想要其他任何东西。
关于html - 在父 div 中定位内部 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9723204/