http://i.stack.imgur.com/XZI9d.png
在上面的图像中,我试图让文本位于菜单栏的左侧和标题下方。我已经尝试了边距和填充,但没有任何运气。这些按钮都位于与文本不同的标签中。代码如下。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<style>
body
{
background-image: url(Background.gif);
repeat: no-repeat;
background-repeat: no-repeat;
}
div.button
{
width: 220px;
padding:0px, 0px, 0px, 30px;
border:0px;
margin:0px;
}
div.textbox
{
border: 0 px;
margin-top: 300 px;
margin-left: 300 px;
background-color: white;
opactiy: 0.5;
width: 600 px;
}
span
{
width: 600 px;
padding: 90 px, 0 px, 0 px, 250px;
font-family: "Letter Gothic Std Bold";
font-size: 16 pt;
color: #99CCFF;
top: 300px;
left: 300px;
}
</style>
</head>
<body>
<div class = "textbox"><span>
text text text
</span></div>
<div class = "button">
<br>
<br>
<br>
<br>
<img src="DarkLayout_03.gif" width="166" height="66" />
<br>
<br>
<br>
<img src="DarkLayout_06.gif" width="166" height="66" />
<br>
<br>
<br>
<a href="mailto:swy5105@psu.edu"><img src="DarkLayout_08.gif" width="166" height="66" /></a>
<br>
<br>
<br>
<a href = "http://notafilmnoirheroine.tumblr.com"><img src="DarkLayout_11.gif" width="166" height="66" />
<br>
<br>
<br>
<a href = "http://swy5105.tumblr.com"> <img src="DarkLayout_13.gif" width="166" height="66" /></a>
</div>
</body>
</html>