Question

我基本上有一个文本介于两个图像周围，一个在右边，另一个在左边但是，当我试图对齐它时，其中一个图像到达下一行，而我想在同一行这里代码

   <div style="background-color:#ddb56c;clear: both; " class="container">

    <div class="col-lg-3 col-xs-3 col-sm-3 col-md-3">

    </div>

    <div class="col-lg-6 col-xs-6 col-sm-6 col-md-6" >
        <div class="clearfix">
            <img class="img-responsive pull-left" src="images/Homepage_03.png" style="max-width: 100%;"/>
            <h1>Maroon Decor</h1>
            <img class="img-responsive pull-right" src="images/Homepage_05.png" style="max-width: 100%;" />

        </div>
    </div>
</div>

Answer 1

您可以内联显示标题。

No protocol specified
Exception in thread "main" java.awt.AWTError: Can't connect to X11 window server using ':0.0' as the value of the DISPLAY variable.
        at sun.awt.X11GraphicsEnvironment.initDisplay(Native Method)
        at sun.awt.X11GraphicsEnvironment.access$200(X11GraphicsEnvironment.java:65)
        at sun.awt.X11GraphicsEnvironment$1.run(X11GraphicsEnvironment.java:115)
        at java.security.AccessController.doPrivileged(Native Method)
        at sun.awt.X11GraphicsEnvironment.<clinit>(X11GraphicsEnvironment.java:74)
        at java.lang.Class.forName0(Native Method)
        at java.lang.Class.forName(Class.java:260)
        at java.awt.GraphicsEnvironment.createGE(GraphicsEnvironment.java:102)
        at java.awt.GraphicsEnvironment.getLocalGraphicsEnvironment(GraphicsEnvironment.java:81)
        at java.awt.Window.initGC(Window.java:475)
        at java.awt.Window.init(Window.java:495)
        at java.awt.Window.<init>(Window.java:537)
        at java.awt.Frame.<init>(Frame.java:420)
        at java.awt.Frame.<init>(Frame.java:385)
        at javax.swing.JFrame.<init>(JFrame.java:181)
        at Testtagreader.TestGUI.<init>(TestGUI.java:30)
        at testtagreader.Test_XML_Reader.main(Test_XML_Reader.java:29)

Answer 2

你必须这样做。您必须在3 + 6 + 3中划分屏幕。将一张图片放入div 3，然后将文字放入div 6，然后将另一张图片放入div 3

**如果您使用全部col-lg-x col-xs-x col-sm-x col-md-3，则所有设备的设计都是相同的。

    <div class="col-lg-3 col-xs-3 col-sm-3 col-md-3">
      <img class="img-responsive pull-left" src="images/Homepage_03.png" style="max-width: 100%;"/>
    </div>

    <div class="col-lg-6 col-xs-6 col-sm-6 col-md-6" >
        <div class="clearfix">

            <h1>Maroon Decor</h1>


        </div>
    </div>

    <div class="col-lg-3 col-xs-3 col-sm-3 col-md-3">
      <img class="img-responsive pull-right" src="images/Homepage_05.png" style="max-width: 100%;" />
    </div>
</div>

在同一行boostrap上对齐两个图像和文本

2 个答案: