how to align img inside the div to the right?

前端 未结 6 1526
滥情空心
滥情空心 2021-02-03 20:31

I would like to know how to align the image inside the div on the right side?

相关标签:
6条回答
  • 2021-02-03 20:59

    There are plenty of ways to align with CSS, each one has it's benefits and disadvantages, you could test them all to check which one fits your case better: http://www.w3schools.com/css/css_align.asp

    TIP: Always search using W3 as extra word, that will give you in first places the resources of the W3school website or the w3.org if there's any relevant.

    0 讨论(0)
  • 2021-02-03 21:02

    You can give the surrounding div a

    text-align: right
    

    this will leave white space to the left of the image. (= the image will occupy the whole line).

    If you want content to be shown to the left hand side of the image, use

    float: right
    

    on the image. However, the surrounding div will then need overflow: auto to stretch to the needed height.

    0 讨论(0)
  • 2021-02-03 21:04

    vertical-align:middle; text-align:right;

    0 讨论(0)
  • 2021-02-03 21:06
    <style type="text/css">
    >> .imgTop {
    >>  display: block;
    >>  text-align: right;
    >>  }
    >> </style>
    
    <img class="imgTop" src="imgName.gif" alt="image description" height="100" width="100">
    
    0 讨论(0)
  • 2021-02-03 21:08
    <p>
      <img style="float: right; margin: 0px 15px 15px 0px;" src="files/styles/large_hero_desktop_1x/public/headers/Kids%20on%20iPad%20 %202400x880.jpg?itok=PFa-MXyQ" width="100" />
      Nunc pulvinar lacus id purus ultrices id sagittis neque convallis. Nunc vel libero orci. 
      <br style="clear: both;" />
    </p>
    
    0 讨论(0)
  • 2021-02-03 21:17
    <div style="width:300px; text-align:right;">
            <img src="someimgage.gif">
    </div>
    
    0 讨论(0)
提交回复
热议问题