我如何将我的图片浮动到许多段落的右侧?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了我如何将我的图片浮动到许多段落的右侧?相关的知识,希望对你有一定的参考价值。

[我要做的是使段落文本向左浮动,并以明显的边距和填充物环绕图像,并使其对齐,并使图像向右侧浮动到段落文本。图像应位于右上角容器和段落应该包裹图像。我已经将图像和段落放置在引导程序的容器div中。我如何实现这种设计?

这是html代码:

#about-us {
  padding: 4em 0;
  background-color: #ffffff;
}

#about-us p {
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  color: #5a5a5a;
  text-align: justify;
  float: left;
}

#about-us img {
  float: right;
}
<section id="about-us">
  <div class="container">
    <p>Huatai Securities Co.,Ltd. is a leading integrated securities group in China, with a substantial customer base, a leading e-Platform and a highly collaborative full-service business model.</p>
    <p>Huatai Securities was established in May 1991.On February 26, 2010, we were listed at Shanghai Stock Exchange with the stock code of 601688. On June 1, 2015, our H Shares have been listed on The Stock Exchange of Hong Kong Limited with the stock code
      of 6886. Over our more than two decades of operating history, we achieved rapid growth by successfully capitalizing on the transformation and innovation opportunities of China's capital market and securities industry. Our major financial indicators
      and business indicators are among the forefront of the domestic securities industry.</p>
    <p>Currently, Huatai Securities has controlling interests in 3 subsidiaries including Huatai United Securities Co., Ltd., Huatai Futures Co.,Ltd., and Jiangsu Equity Exchange Co., Ltd. We have 4 wholly owned subsidiaries including Huatai Financial Holdings(Hong
      Kong) Limited, Huatai Zijin Investment Co., Ltd., Huatai Innovation Investment Co., Ltd., and Huatai Securities (Shanghai) Asset Management Co., Ltd. We also have minority interests in China Southern Asset Management Co., Ltd., Huatai-PineBridge
      Fund Management Co., Ltd., Bank of Jiangsu Co., Ltd., GP Capital Co., Ltd., and E-Capital Transfer Co., Ltd.</p>
    <p>During recent years, Huatai Securities has focused on providing customers with the full life-cycle integrated financial services. We have built a full-service business model which is led by investment banking, underpinned by brokerage and wealth management
      and supported by asset management as well as investment and trading.</p>
    <p>Huatai Securities has the largest securities brokerage business in China and a leading e-Platform in the industry. We ranked No.1 in terms of brokerage trading volume of stocks and funds in China's securities industry in 2014.As of the end of 2014,
      the number of our securities brokerage accounts ranked No.1 among all China's securities firms; and the balance of our margin loans and securities lent ranked No.2 and the market value of our client entrusted securities ranked No.3 in China's securities
      industry. Our mobile wealth management terminal, “ZhangLe Fortune Path”, was rated No.1 by Sina.com in its review of mobile securities apps in 2014.</p>
    <p>Huatai Securities has a leading comprehensive investment banking franchise and the top M&A advisory business in the industry. In terms of the number of CSRC-approved M&A advised by us, we have been ranked No.1 in the industry for the three consecutive
      years since 2012. In 2014, our equity and debt underwriting businesses also ranked among the top ten securities firms in China, in terms of both value and number of transactions underwritten.</p>
    <p>Huatai Securities also has one of the largest comprehensive asset management businesses in China's securities industry, with leading product innovation capability. The AUM of our collective asset management schemes as of the end of 2014 and the net
      revenue from our asset management business in 2014 ranked No.2 and No.3, respectively, in China's securities industry.</p>
    <p>From now on, we plan to leverage our competitive advantages in the securities business to expand our full-service operations, and aim to become a leading integrated financial group which has a profound impact in Asia-Pacific Market with strong local
      advantages and a global vision.</p>
    <img src="images/about-us.png" alt="">
  </div>
</section>
答案

如果尝试在容器右侧的top处制作图片,则需要直接将移动到该容器的下方。

img {
  float: right;
  margin: 0.5em 0 0.5em 1em;
}
<section id="about-us">
  <div class="container">
    <img src="https://via.placeholder.com/150" alt=""><!-- first child of .container-->
    <p>Huatai Securities Co.,Ltd. is a leading integrated securities group in China, with a substantial customer base, a leading e-Platform and a highly collaborative full-service business model.</p>
    <p>Huatai Securities was established in May 1991.On February 26, 2010, we were listed at Shanghai Stock Exchange with the stock code of 601688. On June 1, 2015, our H Shares have been listed on The Stock Exchange of Hong Kong Limited with the stock code
      of 6886. Over our more than two decades of operating history, we achieved rapid growth by successfully capitalizing on the transformation and innovation opportunities of China's capital market and securities industry. Our major financial indicators
      and business indicators are among the forefront of the domestic securities industry.</p>
    <p>Currently, Huatai Securities has controlling interests in 3 subsidiaries including Huatai United Securities Co., Ltd., Huatai Futures Co.,Ltd., and Jiangsu Equity Exchange Co., Ltd. We have 4 wholly owned subsidiaries including Huatai Financial Holdings(Hong
      Kong) Limited, Huatai Zijin Investment Co., Ltd., Huatai Innovation Investment Co., Ltd., and Huatai Securities (Shanghai) Asset Management Co., Ltd. We also have minority interests in China Southern Asset Management Co., Ltd., Huatai-PineBridge
      Fund Management Co., Ltd., Bank of Jiangsu Co., Ltd., GP Capital Co., Ltd., and E-Capital Transfer Co., Ltd.</p>
    <p>During recent years, Huatai Securities has focused on providing customers with the full life-cycle integrated financial services. We have built a full-service business model which is led by investment banking, underpinned by brokerage and wealth management
      and supported by asset management as well as investment and trading.</p>
    <p>Huatai Securities has the largest securities brokerage business in China and a leading e-Platform in the industry. We ranked No.1 in terms of brokerage trading volume of stocks and funds in China's securities industry in 2014.As of the end of 2014,
      the number of our securities brokerage accounts ranked No.1 among all China's securities firms; and the balance of our margin loans and securities lent ranked No.2 and the market value of our client entrusted securities ranked No.3 in China's securities
      industry. Our mobile wealth management terminal, “ZhangLe Fortune Path”, was rated No.1 by Sina.com in its review of mobile securities apps in 2014.</p>
    <p>Huatai Securities has a leading comprehensive investment banking franchise and the top M&A advisory business in the industry. In terms of the number of CSRC-approved M&A advised by us, we have been ranked No.1 in the industry for the three consecutive
      years since 2012. In 2014, our equity and debt underwriting businesses also ranked among the top ten securities firms in China, in terms of both value and number of transactions underwritten.</p>
    <p>Huatai Securities also has one of the largest comprehensive asset management businesses in China's securities industry, with leading product innovation capability. The AUM of our collective asset management schemes as of the end of 2014 and the net
      revenue from our asset management business in 2014 ranked No.2 and No.3, respectively, in China's securities industry.</p>
    <p>From now on, we plan to leverage our competitive advantages in the securities business to expand our full-service operations, and aim to become a leading integrated financial group which has a profound impact in Asia-Pacific Market with strong local
      advantages and a global vision.</p>
    
  </div>
</section>
另一答案

[尝试删除#about-us p的float属性,然后将图像标签移到容器div的顶部,它将起作用。

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Static Template</title>
    <style>
      #about-us {
        padding: 4em 0;
        background-color: #ffffff;
      }

      #about-us p {
        font-family: "Montserrat", sans-serif;
        font-size: 14px;
        color: #5a5a5a;
        text-align: justify;
      }

      #about-us img {
        float: right;
      }
    </style>
  </head>
  <body>
    <section id="about-us">
      <div class="container">
        <img src="https://app.sellerseo.com/uploads/print_logo.png" alt="" />
        <p>
          Huatai Securities Co.,Ltd. is a leading integrated securities group in
          China, with a substantial customer base, a leading e-Platform and a
          highly collaborative full-service business model.
        </p>
        <p>
          Huatai Securities was established in May 1991.On February 26, 2010, we
          were listed at Shanghai Stock Exchange with the stock code of 601688.
          On June 1, 2015, our H Shares have been listed on The Stock Exchange
          of Hong Kong Limited with the stock code of 6886. Over our more than
          two decades of operating history, we achieved rapid growth by
          successfully capitalizing on the transformation and innovation
          opportunities of China's capital market and securities industry. Our
          major financial indicators and business indicators are among the
          forefront of the domestic securities industry.
        </p>
        <p>
          Currently, Huatai Securities has controlling interests in 3
          subsidiaries including Huatai United Securities Co., Ltd., Huatai
          Futures Co.,Ltd., and Jiangsu Equity Exchange Co., Ltd. We have 4
          wholly owned subsidiaries including Huatai Financial Holdings(Hong
          Kong) Limited, Huatai Zijin Investment Co., Ltd., Huatai Innovation
          Investment Co., Ltd., and Huatai Securities (Shanghai) Asset
          Management Co., Ltd. We also have minority interests in China Southern
          Asset Management Co., Ltd., Huatai-PineBridge Fund Management Co.,
          Ltd., Bank of Jiangsu Co., Ltd., GP Capital Co., Ltd., and E-Capital
          Transfer Co., Ltd.
        </p>
        <p>
          During recent years, Huatai Securities has focused on providing
          customers with the full life-cycle integrated financial services. We
          have built a full-service business model which is led by investment
          banking, underpinned by brokerage and wealth management and supported
          by asset management as well as investment and trading.
        </p>
        <p>
          Huatai Securities has the largest securities brokerage business in
          China and a leading e-Platform in the industry. We ranked No.1 in
          terms of brokerage trading volume of stocks and funds in China's
          securities industry in 2014.As of the end of 2014, the number of our
          securities brokerage accounts ranked No.1 among all China's securities
          firms; and the balance of our margin loans and securities lent ranked
          No.2 and the market value of our client entrusted securities ranked
          No.3 in China's securities industry. Our mobile wealth managemen

以上是关于我如何将我的图片浮动到许多段落的右侧?的主要内容,如果未能解决你的问题,请参考以下文章

如何让特定段落向左浮动,图像向右浮动

如何将搜索图标浮动到右侧

浮动后对齐中心项目

为啥子div不浮动到右侧? [复制]

使用CSS的圆形文本段落[重复]

如何制作浮动视图?