2013-12-21 15 views
1

我有一個網頁,我想把一些文字從this這個圖像的頂部開始。但是我將照片改爲了一個asp圖片,這樣我就可以將它變成博客所有者能夠更改照片的位置。由於我將其改爲asp控件,因此我能夠做的最好的事情就是在照片底部啓動文本。有沒有辦法做兩列或什麼東西並把它們放在一起?這是我目前的代碼:我想把一些文字放在我的asp圖像旁邊,但我好像不明白

<div class="aboutBodyStyle"> 
    <asp:AccessDataSource ID="AccessDataSource3" runat="server" 
      DataFile="~/App_Data/TravelJoansDB.mdb" 
       SelectCommand="SELECT PicPath FROM AboutPic"></asp:AccessDataSource> 

      <asp:FormView ID="Formview2" runat="server" DataSourceID="AccessDataSource3"> 
      <ItemTemplate> 
      <asp:Image ID="Image1" CssClass="placePicCenter" runat="server" 
          BorderWidth="1px" 
          BorderColor="#EEEEEE" 
          ImageUrl='<%# "Website Photos/" + Eval("PicPath") %>' /> 
      </ItemTemplate>        
      </asp:FormView> 
    Hello! My name is Jo Ann, pen name TRAVEL JOANS, and welcome to my journey. I’m an avid traveler with an 
    intense passion for travel, culture, language and photography. I started my travel blog as a way to document 
    my travels, share my awesome travel adventures and connect with other liked-mind travelers and bloggers. 
    My travels have taken to some unique and faraway places and . . . <br /></div> 

<h1 class="aboutHeader2Style">OOPS . . . LET ME BACK UP TO . . . HOW IT ALL STARTED!</h1> 

<p class="aboutBodyStyle"> 
In 1997, I decided that it was time to spread my wings and see the world. Since it would be my first time traveling abroad, I wanted my trip to be flawless so I enlis... 

等等。如何將文字放在照片的頂部?

+0

將「align =」left「'添加到照片 – Aristos

回答

2

標記:

<ItemTemplate> 
    <p> 
     <asp:Image ID="Image1" CssClass="imageLeft" runat="server" 
      BorderWidth="1px" BorderColor="#EEEEEE" 
       ImageUrl='<%# "Website Photos/" + Eval("PicPath") %>' /> 
     My name is Jo Ann, pen name TRAVEL JOANS, and welcome to my journey. 
     I’m an avid traveler with an intense passion for travel, culture, 
     language and photography. I started my travel blog as a way to document 
     my travels, share my awesome travel adventures and connect with other 
     liked-mind travelers and bloggers. My travels have taken to some unique 
     and faraway places and . . . 
    </p> 
</ItemTemplate> 

CSS:

.imageLeft 
{ 
    float: left; 
    margin-right: 10px; 
    margin-bottom: 10px; 
} 

它是可選的,你是否希望將圍繞在模板圖像的領先文本。您還可以設置FormView的尺寸以匹配圖像的尺寸,並將文本置於控件之外;任何方式應該工作。

+0

浮動圖像。尼斯。再次感謝。 – Joseph

相關問題