Html 在页面上定位图像
我在ASP.NET中有一个图像,我希望我能非常清楚地解释这一点,以便您能给出非常清楚的答案 “我的主窗体”具有以下设置:Html 在页面上定位图像,html,css,Html,Css,我在ASP.NET中有一个图像,我希望我能非常清楚地解释这一点,以便您能给出非常清楚的答案 “我的主窗体”具有以下设置: .page { width: auto; background-color: #fff; margin: 0px auto 0px auto; border: 1px solid #496077; height: auto; } .header { position: relative; margin: 0px;
.page
{
width: auto;
background-color: #fff;
margin: 0px auto 0px auto;
border: 1px solid #496077;
height: auto;
}
.header
{
position: relative;
margin: 0px;
padding: 0px;
background: #4b6c9e;
width: 100%;
}
.header h1
{
font-weight: 700;
margin: 0px;
padding: 0px 0px 0px 20px;
color: #f9f9f9;
border: none;
line-height: 2em;
font-size: 2em;
}
.main
{
padding: 0px 12px;
margin: 12px 8px 8px 8px;
}
.leftCol
{
padding: 6px 0px;
margin: 12px 8px 8px 8px;
width: 200px;
min-height: 200px;
}
.footer
{
color: #4e5766;
padding: 8px 0px 0px 0px;
margin: 0px auto;
text-align: center;
line-height: normal;
}
我有一个“联系我们”页面,页面左侧空白处有一个人的每个条目的可变信息(姓名、地址、联系信息等)。我想定位一个图像,它只比为某个人提供的最右边的信息多几个像素,并且我希望图片的高度x宽度根据文本的高度而变化(如果用户要为每个联系人输入更多的信息行,等等)
如何使用此定位获取图像?到目前为止,我已经能够在屏幕的最右侧获得一个图像,但这并不好,因为我希望在表单上有两列联系信息以获得更多空间
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
<h1>Contact Information<b><img align="left" alt="pic" class="bold"
src="profilepic.jpg"
style="width: 150px; height: 150px; float: right;" vspace="0" /></b></h1>
<b><h2>adsf</h2>
adsf</b> <br />
asdf<br />
asdf</br>
asdf <br />
asdf <br />
asdf
</asp:Content>
联系方式
adsf
adsf
asdf
asdf
asdf
asdf
asdf
您是否考虑过使用表格?可以使用类设置行宽度、文本对齐方式、垂直对齐方式和所有其他样式yadda yadda;或者你怎么选择。但这将为每个人设置列和行
<table class="table">
<tr class="tableRow">
<td class="tableDataLeft">
Some Persons info Number 1
</td>
<td class="tableDataMiddle">
Person Number 1's second column of info
</td>
<td class="tableDataRight">
Person number 1's image...<img src/>
</td>
</tr>
<tr>
<tdclass="tableDataLeft">
Some Persons info Number 2
</tdclass="tableDataLeft">
<td class="tableDataMiddle">
Person Number 2's second column of info
</td>
<td class="tableDataRight">
Person number 2's image...<img src/>
</td>
</tr>
</table>
一些人的信息1
1号人物的第二列信息
1号人物的形象。。。
一些人的信息2
2号人物的第二栏信息
2号人物的形象。。。
欢迎使用堆栈溢出!对于这样的问题,如果你能抽象出你的问题,这将有助于澄清你想要什么:“给定X,我希望Y在Z中,我试过N”。除此之外,给我们一个JSFIDLE,其中包含一个您想要实现的示例。执行这些步骤,你也可能自己找到解决方案。你是说:?@Brian这正是我要找的