Html 图像旁边的Div_Html_Css - Fatal编程技术网

Html 图像旁边的Div

html css

Html 图像旁边的Div,html,css,Html,Css,我有以下代码： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=

我有以下代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>TheGelu - Coming Soon</title>
<style type="text/css">
body {
  background: #474747 url(http://line25.com/wp-content/uploads/2009/letterpress/demo/bg.png);
}
p.margin {  
  margin-left:300px;
}
p.box { 
  margin-left:300px;
}
h1 {
  font: 60px Helvetica, Arial, Sans-Serif; letter-spacing: -5px;  
  color: #999; text-shadow: 0px 3px 8px #2a2a2a;
}
boxy {
  border: 0px solid #db9b20;
  text-align: center;
  background-color: #f0f0f0;
  padding: 0px 0px 0px 0px;
  margin: 4px 0px 4px 0px;
  moz-box-shadow: 5px 5px 5px #000;
  -moz-border-shadow: 0pc;
  -khtml-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  -moz-box-shadow:0px 0px 0px 3px rgba(240, 240, 240, 1);
  -webkit-box-shadow:0px 0px 0px 3px rgba(240, 240, 240, 1);
  box-shadow:0px 0px 0px 3px rgba(240, 240, 240, 1);
}
</style>
</head>
<body><h1><center>TheGelu *-*</center></h1>
<p class="margin"><img src="RoundRound.png" alt="" width="136" height="137" /><img src="arrowSignal.png" alt="" width="318" height="126" /></p><div style="width:400px;height:300px;float:right;-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px;background-color:#FFFFFF;-webkit-box-shadow: #000000 2px 2px 2px;-moz-box-shadow: #000000 2px 2px 2px; box-shadow: #000000 2px 2px 2px;">Pretty Text Here!</div>
</body>
</body>
</html>


他们很快就要来了
身体{
背景：#474747 url(http://line25.com/wp-content/uploads/2009/letterpress/demo/bg.png);
}
p、 边距{
左边距：300px；
}
p、 框{
左边距：300px；
}
h1{
字体：60px Helvetica，Arial，无衬线；字母间距：-5px；
颜色：999；文本阴影：0px 3px 8px#2a2a2a；
}
方形的{
边框：0px实心#db9b20；
文本对齐：居中；
背景色：#f0；
填充：0px 0px 0px 0px；
保证金：4px0px 4px0px；
莫兹盒阴影：5px 5px 5px#000；
-moz边框阴影：0pc；
-khtml边界半径：10px；
-webkit边界半径：10px；
边界半径：10px；
-moz盒阴影：0px 0px 0px 3px rgba（240，240，240，1）；
-webkit盒阴影：0px 0px 0px 3px rgba（240，240，240，1）；
盒影：0px 0px 0px 3px rgba（240，240，240，1）；
}
提格鲁*-*
这里有漂亮的文字！

我希望这个框正好挨着箭头（在右边）。我该怎么做？我试过浮球，但不知道怎么把它挂起来

您可以在

p.margin

中移动

div

，并在其上指定

style=“display:inline block”

这是您想要的吗？ 1.p、边距，添加浮动：左； 2.文本框div，也添加float:left；完成了

编辑：你是说像这样？因为您的箭头使用图像，并且该图像具有比图像本身更宽的透明背景。解决： 1.修改图像并删除空白

2.无需修改图像，只需添加左边距：-90px；到您的文本框div

我将其移动。现在我该怎么做才能把它放在箭头旁边？@user3142039您是否按照我的建议移除了浮动并设置了

display

？是的。哈哈，我刚注意到问题出在照片上。谢谢我需要它正好挨着箭头。谢谢！！我忘了图像上有空白！！