Question

我将使用什么CSS代码来获取titletext右侧的图像？目前它位于页面的中心，稍微低一点，看起来很糟糕！

这就是我现在所拥有的：

<body>
   <form runat="server">
   <div class="page">
   <div class="header">
   <div class="title">
      <h1>
         Text
      </h1>
   </div>
   <div class="loginDisplay">
   <div class="irc_mutc" style="height: 99px; width: 670px">
      <div id="irc_mimg" style="">
         </a>
         <img id="irc_mi" height="84" class="floatright" 
            src="imagewebsite.com" 
            style="margin-top: 0px;" width="459" />
      </div>
   </div>

Answer 1

不确定你想要什么...但是根据我的理解：

.header h1,
.header img {
  float: left;
  margin-left: 12px;
}
//Clearfix
.header img::after {
  content: '';
  display: table;
  clear: both;
}

<div class="page">
  <div class="header">
    <h1>Text</h1>
    <img id="irc_mi" src="//lorempicsum.com/futurama/459/84/2" />
  </div>
</div>

Answer 2

＆＃13;

<html>
<head>
<title></title>
<style>
.floatright { float:right; }
</style>
</head>
<body>
<div class="page">
    <div class="header">
        <div class="title">
	    <img id="irc_mi" height="84" class="floatright" src="http://placehold.it/459x84" style="margin-top: 0px;" width="459" />
            <h1>Text</h1>
        </div>
        <div class="loginDisplay">
            <div class="irc_mutc" style="height: 99px; width: 670px">
                <div id="irc_mimg" style="">
                    <!--img id="irc_mi" height="84" class="floatright" src="http://placehold.it/400x200" style="margin-top: 0px;" width="459" />-->
		</div>
            </div>
	</div>
    </div>
</div>
</body>
</html>

＆＃13;

目前还不清楚你在这之后到底发生了什么，但这会给你一个与标题右侧对齐的图像。

＆＃13;

<style>
.floatright { float:right; }
</style>

＆＃13;

<div class="page">
    <div class="header">
        <div class="title">
	    <img id="irc_mi" height="84" class="floatright" src="http://placehold.it/459x84" style="margin-top: 0px;" width="459" />
            <h1>Text</h1>
        </div>
        <div class="loginDisplay">
            <div class="irc_mutc" style="height: 99px; width: 670px">
                <div id="irc_mimg" style="">
                    <!--img id="irc_mi" height="84" class="floatright" src="http://placehold.it/400x200" style="margin-top: 0px;" width="459" />-->
		</div>
            </div>
	</div>
    </div>
</div>

＆＃13;

如何将图像移动到表单头部的标题文本右侧

2 个答案: