Html 如何将内容包装在图像周围？

我正在尝试为个人网站创建一个关于页面。我想知道如何把文字环绕在图片上。我想要这种效果

我现在掌握的代码是：

 <div class="about_content">
            <img src="placeholder.jpg" alt="">
            <h2>The Brand</h2>
            </p>
            The Tailory New York is an appointment only custom clothing              company that combines the modernity of Fashion Design with the heritage art of Custom Tailoring. We are unique in that we cater to both the Men and Women market.
           </p>
            <h2>The Concept </h2>
                <p>
                    Providing personally designed, fitted and curated collections for each individual client is the essence of who we are. At The Tailory New York, we believe that your wardrobe should not only fit perfectly, but should be designed with only YOU in mind. The end result?—clients get the best of both worlds, impeccable custom fit and custom designed pieces that works seamlessly with their lifestyle.
                </p>
            <h2>A Note From the Founder</h2>
                <p>
                    The idea for The Tailory New York began when I decided to direct my years of fashion design and men’s tailoring experience towards my own wardrobe. As a pant suit aficionado and a lover of men’s fashion and tailoring, I was always drawn to tailored clothing and strived to create fashion that conveyed the same message of confidence that a perfectly custom tailored suit did for men. Style icons like Sean Connery and Cary Grant, as well as modern day 007 Daniel Craig (shaken not stirred) were always my style inspirations. To me, they are the epitome of refinement and sophistication, true gentlemen in style.
                    My passion for fashion and tailoring led me through the Fashion Design program at Parsons followed by stints in custom tailoring, fashion design, fashion styling and brand development. But the more I integrated myself in the industry, the more I realized that impeccable fit, for men and women, was almost impossible to find in ready to wear clothing. So, I launched The Tailory New York, a way for me to combine my two passions, Fashion Design and Custom Tailoring. Everyone wants to look their best and having a wardrobe curated to your body and lifestyle not only enables you to look your best but makes you feel your best.
                    At The Tailory New York, “we believe that your wardrobe should not only fit perfectly, but should be designed with only YOU in mind.” Providing personally designed, fitted and curated collections for each individual client is the essence of who we are. Let us curate and design the wardrobe fit for YOU! </br>
                    <br> </br>
                    Sincerely,</br>
                    Shao Yang, Founder 
                    <br> </br>
                </p> 
        </div>

---

您现在拥有的内容将使内容环绕图像。这样做的诀窍是应用

float:left到图像，这是您已经完成的

我怀疑你的形象太宽了。如果是500px或更宽，图像将占据整个
。about_content
，因此您需要限制图像的大小。下面是一个在图像上使用
max width
的示例


h2{
利润率：0.1.2米0；
字体系列：“Raleway”、“无衬线字体”；
字体大小：正常；
}
.关于内容{
宽度：500px；
溢出：隐藏；
}
.关于内容img{
右边距：15px；
浮动：左；
最大宽度：250px；
}
.关于内容p：最后一个孩子{
页边距底部：0；
}

品牌

纽约裁缝店是一家仅限预约的定制服装公司，它将时尚设计的现代性与定制剪裁的传统艺术相结合。我们的独特之处在于我们同时满足男性和女性市场的需求。

概念

为每个客户提供个人设计、合身和精心策划的系列是我们的本质。在纽约Tailory，我们相信您的衣柜不仅应该完美贴合，而且应该在设计时只考虑您。最终结果？——客户获得了两个方面的最佳体验，完美的定制贴合感和定制设计，与他们的生活方式完美契合。

创始人的便条

纽约裁缝店的想法始于我决定将多年的时装设计和男装剪裁经验用于我自己的衣柜。作为一名裤子套装爱好者和一名男士时尚和剪裁爱好者，我总是被量身定制的服装所吸引，并努力创造出一种时尚，传达出与完美定制西装同样的自信信息。肖恩·康纳利（Sean Connery）和卡里·格兰特（Cary Grant）等时尚偶像，以及现代007丹尼尔·克雷格（Daniel Craig，摇而不动）一直是我的时尚灵感来源。对我来说，它们是优雅和成熟的缩影，是真正的绅士风范。
我对时尚和剪裁的热情引导我完成了帕森斯的时尚设计课程，之后在定制剪裁、时尚设计、时尚造型和品牌开发方面工作。但我越是融入这个行业，就越意识到无论男女，在成衣中几乎找不到完美的合身。于是，我创办了纽约裁缝店，这是一种将我的两大爱好——时装设计和定制——结合起来的方式。每个人都想让自己看起来最好，根据自己的身体和生活方式精心设计的衣橱不仅能让你看起来最好，还能让你感觉最好。
在纽约Tailory，“我们相信你的衣柜不仅应该完美贴合，而且应该只考虑你。”为每个客户提供个人设计、合身和精心策划的系列是我们的本质。让我们为您策划和设计适合您的衣柜




真诚地

创始人邵阳




嗨，迈克尔，非常感谢！这对我有用！接下来的问题是，我如何改变文本和图片之间的距离？比如，我想把文字从图片上拖开，然后放在一个看不见的盒子里？@Catherine sweet，没问题。要在图像和文本之间留出一些空间，请将边距应用于
。关于内容img
。不知道你说的隐形盒子是什么意思。
h2{
    margin: 0 0 1.2em 0;
    font-family: 'Raleway', 'sans-serif';
    font-weight: normal;
}

.about_content{
    width: 500px;
    overflow: hidden;
  }

.about_content img{
    margin-right: 15px;
    float: left;
}
.about_content p: last-child{
    margin-bottom: 0;
}