html - 向右浮动但保持逻辑顺序

标签 html css

我有以下标记,它会在右侧生成一个带有图像的段落。

<p>
  <div style="float: right;">
    <img src="http://placehold.it/100x50"/>
    <div>Caption</div>
  </div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
Morbi commodo nibh a sem ornare porttitor. 
Maecenas ultrices tristique est in interdum. 
</p>

这会使图像向右浮动,但也允许文本环绕图像。

因为我使用响应式设计,所以我想知道是否有任何方法可以保留以下格式

Formatting

但要按“逻辑顺序”进行编码,即;

<p>text
<div>
    <img>
    {caption}

最佳答案

你试过吗

text-align: left; 

标题 div?

关于html - 向右浮动但保持逻辑顺序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23825285/

相关文章:

html - 修复了 contenteditable 元素中的填充

html - 绝对定位的元素落在其父容器之外

jquery - 在 jQuery 中获取元素的宽度作为 float

javascript - 为什么 Angular 不渲染我的 CSS?

css - 您如何使图像保持原位但与浏览器或屏幕分辨率保持一致

css - 将多个元素放置在列的右侧

javascript - 通过php显示javascript内容

javascript - 如何在滚动时将 jQuery 阴影函数应用于具有相同类名的多个元素

css - 如何去除描边边框

html - 如何使用div创建表格