个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
你好，我无法让我的 windingroad.gif float 到我的页面右侧，但我不知道我做错了什么。我已经尝试了一切，但我一定遗漏了一些东西。非常感谢您的帮助。
body { background-color: #ffffcc;
background-image: url(background.gif);
color: #330000;
font-family: Verdana, Arial, sans-serif;
}
#wrapper { width: 80%;
margin-right: auto;
margin-left: auto;
background-color: #ffffcc;
min-width: 700px;
max-width: 1024px;
box-shadow: 3px 3px 3px #333333;
}
header { background-color: #ccaa66;
background-image:url("javalogo.gif");
background-position:center;
background-repeat:no-repeat;
color: #000000;
height:100px;
}
h1 {margin:0;
text-indent:100%;
white-space:nowrap;
overflow:hidden;
}
h2 { text-transform:uppercase;
background-color:#ffffcc;
color:#663300;
font-size:1.2em;
border-bottom:1px solid #000000;
padding:5px 0 0 5px;
margin-right:20px;
clear: left;
}
nav { text-align: center;
float:left;
width:100px;
font-weight:bold;
padding-top:10px;
/* unvisited link */
nav a:link {
color: #996633;
{
/* visited link */
nav a:visited {
color: #ccaa66;
}
/* mouse over link */
nav a:hover {
color: #330000;
}
nav ul {list-style-type:none;
}
}
footer { background-color: #ccaa66;
color: #000000;
font-size: .60em;
font-style: italic;
text-align: center;
padding-top:20px;
padding-bottom:20px;
clear:both;
}
main { padding-top: 10px;
padding-bottom:30px;
padding-left:20px;
padding-right:20px;
margin-left:150px;
background-color:#f2eab7;
color:#000000;
overflow:auto;
}
.details { padding-left: 20%;
padding-right: 20%;
overflow:auto;
}
img { border-style: none; }
nav a {text-decoration:none;
padding-bottom:15px;
}
.floatright {float: right;
padding-left:20px;
}
.floatleft{float: left;
padding-right:20px;
padding-bottom:bottom;
}
header,nav,main,footer{display:block;}<!DOCTYPE html>
<html lang="en">
<head>
<title>JavaJam Coffee House</title>
<meta charset="utf-8">
<link rel="stylesheet" href="javajam.css">
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js">
</script>
<![endif]-->
</head>
<body>
<div id="wrapper">
<header>
<h1>JavaJam Coffee House</h1>
</header>
<nav>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="menu.html">Menu</a></li>
<li><a href="music.html">Music</a></li>
<li><a href="jobs.html">Jobs</a></li>
</ul>
</nav>
<main>
<p>Follow the winding road to JavaJam...</p>
<img src="windingroad.jpg" class="floatright" alt="winding road through the woods"
height="156" width="333">
<ul>
<li>Specialty Coffee and Tea</li>
<li>Bagels, Muffins, and Organic Snacks</li>
<li>Music and Poetry Readings</li>
<li>Open Mic Night</li>
</ul>
<div>
12312 Main Street<br>
Mountain Home, CA 93923<br>
1-888-555-5555<br>
<br>
</div>
</main>
<footer>
Copyright © 2014 JavaJam Coffee House<br>
<a href="mailto:yourfirstname@yourlastname.com">yourfirstname@yourlastname.com</a>
</footer>
</div>
</body>
</html>最佳答案
问题出在 CSS 中:1. 您没有在 nav{} block 中用“}”关闭导航。2. 将左括号放在导航 a:link block 的末尾，而不是“}”。
nav { text-align: center;
float:left;
width:100px;
font-weight:bold;
padding-top:10px;
/* unvisited link */
nav a:link {
color: #996633;
{
上面的代码应该这样写:
nav { text-align: center;
float:left;
width:100px;
font-weight:bold;
padding-top:10px;
}
/* unvisited link */
nav a:link {
color: #996633;
}
关于html - .float right 类不会向右浮动，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35743504/
25
4
0
我有一个 Segment 类和一个这样的段数组: private static class Segment { int number, type; Segment(in
我在 SO 中看到一些创建 multilanguage websites in JavaScript 的好建议包括 this article on JavaScript internationaliz
我们有浏览器前缀或黑客 (for Google and Safari) text-align: -webkit-right; (for Firefox) text-align:
过去几天我一直在关注这个问题，我正处于需要寻求帮助的地步。 http://cub.northnodes.com/index.php/about/mission/ 我需要立即捐赠 列一直 float 到
When I press right ctrl, I want the right shift the text will align right. When I press left ctrl le
我已经将右侧的列拆分为顶部和底部。在每个部分中，我在执行以下操作时遇到问题:我希望顶部占据左列高度的 50%，底部占据左列高度的另外 50%。 +-------------------+-------
我知道这个问题的标题很糟糕。对不起。 我有四个 div similar to this .我想要做的只是让 div 编号 2 和 4 之间的垂直空间被删除，而不改变 HTML 的结构。是否可以仅使用
我将表格设置为 100% 宽度。我会添加一个带有 php 的随机 div，有时会充满广告。我希望广告 div 位于表格的右侧和内容。我希望表格位于左侧，但仍为 100% 左右，它将填充广告 div 左
这个问题在这里已经有了答案: Bootstrap align navbar items to the right (24 个答案) 关闭 5 年前。
.floatright { float: right;margin: 0 0 10px 10px;clear: right;width:60px; height:60px; } Lorem
我正在尝试将 td 中的某些内容右对齐。 align="right"有效，但 text-align:right 无效。这是一个 jsfiddle显示这两种情况的示例。除了右对齐右列外，这两种情况是相同
在设计网站时，您认为用于特定任务的最佳图像格式是什么？ 在试图找出用于特定任务的格式时，我总是发现自己处于两难境地……例如，我应该全面使用 .jpg 吗？或者，我何时以及为什么应该使用 .png？ 例
我是一个 MySQL 新手，今天我尝试设置一个超过 5 行的 MySQL 调用。我不断收到语法错误，我尝试修复了几个小时，但我不知道问题出在哪里。这是代码: USE myDatabase; DELIM
这让我发疯。我有一个 div float 到另一个 div 的右侧，如下所示: Current Membership: 我有以下 css 规则: div#container { f
我有以下代码片段，它会产生不需要的“填充”区域，而填充为零。如何避免这个区域？ 代码 div.left { background-color: red; max-width: 25%; f
在 C++ 中，表达式 left() = right() 求值 right() left() 按那个顺序。 right() 先行，正如已讨论过的 here. 我想不出让 right() 先走的理由。你
我有一个很小的菜单列表，当鼠标靠近时它应该会增长。在其原始状态下，菜单是右对齐的，悬停时每第二个元素向右移动并左对齐以为增加的高度腾出空间(参见 JSFiddle )。 ul { font-siz
td.myclass{ width: 6em; text-align: right; padding-right: 2em; } 如您所见，我希望单元格中的文本右对齐，距离单元
你怎么能看到 http://jsfiddle.net/73wst/ 我想在停止下开始，但我不知道如何设置它的样式。 我的 HTML: Stop Start 我的 CSS: .sta
一个大的内部 div 在一个小的外部 div 中，并且外部 div 溢出自动。但是为什么没有内部 div margin-right 和外部 div padding-right？ html
我是一名优秀的程序员,十分优秀！