- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我请求你的帮助!我一直试图解决我的问题 2 天......但没有成功:(
我的问题是关于我的 CSS 菜单。当我在我的 CSS 文件的“nav li:hover ul”部分中指定“position:absolute”时,下拉菜单未在 IE9 上显示。但它在 Chrome、Firefox 和 Safari 中工作...如果我将其更改为“position:relative”,菜单会下降但菜单的所有宽度同时下降...所以子菜单不是 160px宽,它是一个 700px 宽的...
我也试图找出它是否可能来自 NivoSlider,但我没有找到任何解决方案...
这是我的 HTML 代码:
<!DOCTYPE html>
<html id="html">
<head>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=9" />
<meta http-equiv="X-UA-Compatible" content="IE=8" />
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!--<script type="text/javascript" src="Javascript.js">
</script>-->
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="nivo-slider.css" type="text/css" media="screen" />
<link rel="stylesheet" href="default/default.css" type="text/css" media="screen" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="jquery.nivo.slider.pack.js" type="text/javascript"></script>
<title>McDonough & Co. Solicitors</title>
</head>
<body id="wrapper">
<header>
<section>
<div id="logos">
<img alt="Logo" src="McDonough%20logo%20copy.png">
<img alt="Accredited by the Law Institute of Victoria"
src="file:///C:/Users/Paul/Desktop/Charlotte/McDonough%20Solicitors%20Website/LIV_Accreditation.png">
<div id="address">
<br>68 Seymour Street,<br>Traralgon, 3844<br> Victoria
<br><br>☎ (03) 5176 1000<br>
<a href="mailto:law@mcdonough.com.au" target="_blank">✉ law@mcdonough.com.au</a><br>
</div>
</div>
<div style="clear:both;"></div>
</section>
<nav id="gradients">
<ul>
<li><a href="file:///C:/Users/Paul/Desktop/Charlotte/McDonough%20Solicitors%20Website/Home.html">Home</a></li>
<li><a href="aboutus.html">About us</a></li>
<li><a href="services.html">Services</a>
<ul id="gradients2">
<li><a href="willsestates.html"> Wills & Estate</a></li><br>
<li><a href="property.html"> Property</a></li><br>
<li><a href="business.html"> Business</a></li><br>
<li><a href="civillitigation.html"> Civil Litigation</a></li><br>
</ul>
</li>
<li><a href="usefullinks.html">Useful Links</a>
<ul id="gradients3">
<li><a href="countycourt.html"> County Court</a></li><br>
<li><a href="vicmagistratescourt.html"> Victorian Magistrates</a></li><br>
<li><a href="supremecourt.html"> Supreme Court</a></li><br>
</ul>
</li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav><br>
</header>
<article id="bloc_page">
<p><section class="slider-wrapper theme-default">
<div id="slider" class="nivoSlider">
<img src="images/image05.jpg" alt="">
<img src="images/image04.jpg" alt=""/>
<img src="images/image06.jpg" alt=""/>
</div>
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider();
});
</script>
<div id="baseline">
"Your accredited Specialist in Business Law & Property Law since 1980"<br><br><br>
</div>
<div id="left">
"Lorem ipsum dolor sit amet, erat nominati efficiendi pri cu. Mea ut simul fabulas, mea id quot admodum. No nec interesset repudiandae, in vim dolore regione,
nec possit alterum forensibus ut. Qui in magna summo scripserit, cu mel agam nullam suscipiantur. Cu admodum ponderum gubergren nec, euismod consequuntur his in.
Id nam diam mazim persius, quem scripserit vim ad, mei cu nulla vitae. Est ex principes posidonium, libris mediocrem pro an, has sonet diceret ex. Nec cu summo constituto.
</div>
<div id="right">
Nibh forensibus est eu, eum et hinc commodo, id justo maiestatis usu. Velit mollis assueverit pro cu.
Ea mea facete scripserit repudiandae. Et ubique ocurreret dissentias sea, ferri noster malorum eu vel. Aliquip admodum liberavisse sea ne, sed in nulla solet nominati.
Mei an clita vivendo assueverit, omnis lorem omittam vel at. Ut bonorum scripserit vis, cum erat erroribus omittantur te, ut tacimates honestatis sea.
</div>
<div style="clear:both;"></div>
</section>
</p></article>
<br><br>
<footer id="footer">
<p>
<a href="index.html">Home |</a>
<a href="forum.html">About us |</a>
<a href="contact.html">Services |</a>
<a href="contact.html">Useful Links |</a>
<a href="contact.html">Contact</a>
<br><br>
© McDonough & Co. Solicitors 2012 - All rights reserved.<br><br>
</p>
</footer>
</body>
</html>
还有我的 CSS 代码:
/* style.css
---------
By Charlotte Routier */
/* Structure générale */
#html
{
width:740px;
margin:auto;
background:#e6f0fa;
}
/* Header */
#logo, header h1
{
display: inline-block;
margin-bottom: 20px;
}
/* Menu de navigation */
nav
{
font-family: 'RawengulkBold';
font-size: .9em;
float: left;
width: 700px;
position:absolute;
z-index:1200;
-webkit-box-shadow: 0 1px 15px 0 #4a4a4a;
-moz-box-shadow: 0 1px 15px 0 #4a4a4a;
box-shadow: 0 1px 15px 0 #4a4a4a;
}
nav ul
{
padding: 0; /* pas de marge intérieure */
list-style-type:none;
text-align:center;
left: 100%;
z-index:1300;
}
nav li
{
float: left;
width:100px;
margin-right: 40px;
list-style-type:none;
display:inline-block;
}
nav ul li a
{
display:inline-block;
width:140px;
line-height:40px; /*hauteur de l'image de fond*/
text-decoration:none;
}
nav li:hover ul, nav li li:hover ul, nav li.sfhover ul, nav li li.sfhover ul /* Sous-listes lorsque la souris passe sur un élément de liste ET sous-sous-lites lorsque la souris passe sur un élément de sous-liste */
{
left:auto; /* Repositionnement normal */
font-size: .8em;
list-style-type:none;
position:absolute;
z-index:900;
display:block;
}
nav li ul /* Sous-listes */
{
z-index:100;
position:absolute;
float:left;
text-align:left;
width: 180px; /* Largeur des sous-listes */
left: -999em; /* Hop, on envoie loin du champ de vision */
text-decoration: none;
min-height: 0;
}
nav a
{
font-size: 1.3em;
color: #000;
text-decoration: none;
}
nav a:hover
{
text-decoration: none;
color: #A2C9EC;
background: #444;
background: -webkit-linear-gradient( #555, #2C2C2C);
background: -moz-linear-gradient( #555, #2C2C2C);
background: -ms-linear-gradient( #555, #2C2C2C);
background: -o-linear-gradient( #555, #2C2C2C);
background: linear-gradient( #555, #2C2C2C);
}
nav a:active
{
text-decoration: none;
color: #a2c9ec;
background: #444;
background: -webkit-linear-gradient( #555, #2C2C2C);
background: -moz-linear-gradient( #555, #2C2C2C);
background: -ms-linear-gradient( #555, #2C2C2C);
background: -o-linear-gradient( #555, #2C2C2C);
background: linear-gradient( #555, #2C2C2C);
box-shadow: 1px 1px 10px black inset,
0 1px 0 rgba( 255, 255, 255, 0.4);
}
#gradients {
background-image: -webkit-linear-gradient(top, #A2C9EC 0%, #e7f2fb 100%);
background-image: -moz-linear-gradient(top, #A2C9EC 0%, #e7f2fb 100%);
background-image: -ms-linear-gradient(top, #A2C9EC 0%, #e7f2fb 100%);
background-image: -o-linear-gradient(top, #A2C9EC 0%, #e7f2fb 100%);
background-image: linear-gradient(top, #A2C9EC 0%, #e7f2fb 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#A2C9EC',endColorstr='#e7f2fb', GradientType=1);
}
#gradients2 {
background-image: -webkit-linear-gradient(top, #e7f2fb 0%, #A2C9EC 100%);
background-image: -moz-linear-gradient(top, #e7f2fb 0%, #A2C9EC 100%);
background-image: -ms-linear-gradient(top, #e7f2fb 0%, #A2C9EC 100%);
background-image: -o-linear-gradient(top, #e7f2fb 0%, #A2C9EC 100%);
background-image: linear-gradient(top, #e7f2fb 0%, #A2C9EC 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e7f2fb',endColorstr='#A2C9EC', GradientType=0);
}
#gradients3 {
background-image: -webkit-linear-gradient(top, #e7f2fb 0%, #A2C9EC 100%);
background-image: -moz-linear-gradient(top, #e7f2fb 0%, #A2C9EC 100%);
background-image: -ms-linear-gradient(top, #e7f2fb 0%, #A2C9EC 100%);
background-image: -o-linear-gradient(top, #e7f2fb 0%, #A2C9EC 100%);
background-image: linear-gradient(top, #e7f2fb 0%, #A2C9EC 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e7f2fb',endColorstr='#A2C9EC', GradientType=0);
}
/* Slideshow */
.nivoSlider {
background:url(/nivo-slider/themes/bar/loading.gif) no-repeat 50% 50%;
width: 700px !important;
height: 230px !important;
z-index:1;
float:center;
position:absolute;
display:inline-block;
}
.theme-default .nivoSlider img {
width: 700px !important;
height: 230px !important;
z-index:1;
}
/* Corps du texte */
body
{
background-color: #ffffff; /* Le fond de la page sera blanc */
color: #000; /* Le texte de la page sera noir */
padding-left: 40px;
padding-right: 40px;
-webkit-box-shadow: 0 1px 15px 0 #4a4a4a;
-moz-box-shadow: 0 1px 15px 0 #4a4a4a;
box-shadow: 0 1px 15px 0 #4a4a4a;
}
#wrapper
{
width:700px;
margin:0 auto;
}
@font-face {
font-family: 'Rawengulk';
src: url('RawengulkDemibold-webfont.eot');
src: url('RawengulkDemibold-webfont.otf') format('truetype'),
url('RawengulkDemibold-webfont.woff') format('woff'),
url('RawengulkDemibold-webfont.eot?#iefix') format('embedded-opentype'),
url('RawengulkDemibold-webfont.svg#QuadrantaBold') format('svg');
}
@font-face {
font-family: 'RawengulkBold';
src: url('RawengulkBold-webfont.eot');
src: url('RawengulkBold-webfont.otf') format('truetype'),
url('RawengulkBold-webfont.woff') format('woff'),
url('RawengulkBold-webfont.eot?#iefix') format('embedded-opentype'),
url('RawengulkBold-webfont.svg#QuadrantaBold') format('svg');
}
#address
{
font-family: 'RawengulkBold';
color: #000;
font-size: 1em;
display: inline-block;
text-align: right;
margin-left:20px;
vertical-align:middle;
line-height: 18px;
}
#baseline
{
font-family: 'RawengulkBold';
color: #000;
font-size: 1.2em;
text-align: center;
}
#left
{
font-family: 'Calibri';
color: #323232;
font-size: .8em;
text-align: justify;
width: 320px;
float:left;
margin-left:2px;
}
#right
{
font-family: 'Calibri';
color: #323232;
font-size: .8em;
text-align: justify;
width: 320px;
float:right;
margin-right:2px;
}
img
{
vertical-align:middle;
}
p
{
color: #000;
font-size: .7em;
font-family: 'Rawengulk';
width:100%; /* On a indiqué une largeur (obligatoire) */
float: right;
text-decoration: none;
}
a /* Liens par défaut (non survolés) */
{
text-decoration: none;
color: #000;
}
a:hover /* Apparence au survol des liens */
{
text-decoration: underline;
color: #000;
}
a:active
{
background-color: none;
}
#footer
{
font-size: 1.1em;
float: center;
text-align: center;
}
如果您需要更多详细信息,请随时询问。
希望你能帮助我!提前谢谢了。夏洛特
PS:这里有两张图片(一张显示在 Chrome 上使用的下拉菜单,另一张显示在 IE 上无法使用的下拉菜单)
最佳答案
您是否检查了绝对定位元素的父元素以确保它是相对定位的?绝对定位的元素将相对于其父容器定位。如果没有指定其他声明,一些浏览器会假定父级是相对定位的。其他浏览器会按字面意思理解您的代码,而不是那么友好。您还可以在 Firefox(或类似工具)中使用 Firebug 来确保元素在页面上的某处“显示”并且只是遇到位置问题吗?如果不是,则可能是悬停目标的呈现没有请求显示菜单。填充,显示: block ; IE 中的宽度/高度声明是此类问题的常见原因。
关于css - 如果导航栏中的绝对位置为 :hover ul,则下拉菜单不会在 IE9 上显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12070127/
尝试使用集成到 QTCreator 的表单编辑器,但即使我将插件放入 QtCreator.app/Contents/MacOS/designer 也不会显示。不过,相同的 dylib 文件确实适用于独
在此代码示例中。 “this.method2();”之后会读到什么?在返回returnedValue之前会跳转到method2()吗? public int method1(int returnedV
我的项目有通过gradle配置的依赖项。我想添加以下依赖项: compile group: 'org.restlet.jse', name: 'org.restlet.ext.apispark', v
我将把我们基于 Windows 的客户管理软件移植到基于 Web 的软件。我发现 polymer 可能是一种选择。 但是,对于我们的使用,我们找不到 polymer 组件具有表格 View 、下拉菜单
我的项目文件夹 Project 中有一个文件夹,比如 ED 文件夹,当我在 Eclipse 中指定在哪里查找我写入的文件时 File file = new File("ED/text.txt"); e
这是奇怪的事情,这个有效: $('#box').css({"backgroundPosition": "0px 250px"}); 但这不起作用,它只是不改变位置: $('#box').animate
这个问题在这里已经有了答案: Why does OR 0 round numbers in Javascript? (3 个答案) 关闭 5 年前。 Mozilla JavaScript Guide
这个问题在这里已经有了答案: Is the function strcmpi in the C standard libary of ISO? (3 个答案) 关闭 8 年前。 我有一个问题,为什么
我目前使用的是共享主机方案,我不确定它使用的是哪个版本的 MySQL,但它似乎不支持 DATETIMEOFFSET 类型。 是否存在支持 DATETIMEOFFSET 的 MySQL 版本?或者有计划
研究 Seam 3,我发现 Seam Solder 允许将 @Named 注释应用于包 - 在这种情况下,该包中的所有 bean 都将自动命名,就好像它们符合条件一样@Named 他们自己。我没有看到
我知道 .append 偶尔会增加数组的容量并形成数组的新副本,但 .removeLast 会逆转这种情况并减少容量通过复制到一个新的更小的数组来改变数组? 最佳答案 否(或者至少如果是,则它是一个错
很难说出这里要问什么。这个问题模棱两可、含糊不清、不完整、过于宽泛或夸夸其谈,无法以目前的形式得到合理的回答。如需帮助澄清此问题以便重新打开,visit the help center . 关闭 1
noexcept 函数说明符是否旨在 boost 性能,因为生成的对象中可能没有记录异常的代码,因此应尽可能将其添加到函数声明和定义中?我首先想到了可调用对象的包装器,其中 noexcept 可能会产
我正在使用 Angularjs 1.3.7,刚刚发现 Promise.all 在成功响应后不会更新 angularjs View ,而 $q.all 会。由于 Promises 包含在 native
我最近发现了这段JavaScript代码: Math.random() * 0x1000000 10.12345 10.12345 >> 0 10 > 10.12345 >>> 0 10 我使用
我正在编写一个玩具(物理)矢量库,并且遇到了 GHC 坚持认为函数应该具有 Integer 的问题。是他们的类型。我希望向量乘以向量以及标量(仅使用 * ),虽然这可以通过仅使用 Vector 来实现
PHP 的 mail() 函数发送邮件正常,但 Swiftmailer 的 Swift_MailTransport 不起作用! 这有效: mail('user@example.com', 'test
我尝试通过 php 脚本转储我的数据,但没有命令行。所以我用 this script 创建了我的 .sql 文件然后我尝试使用我的脚本: $link = mysql_connect($host, $u
使用 python 2.6.4 中的 sqlite3 标准库,以下查询在 sqlite3 命令行上运行良好: select segmentid, node_t, start, number,title
我最近发现了这段JavaScript代码: Math.random() * 0x1000000 10.12345 10.12345 >> 0 10 > 10.12345 >>> 0 10 我使用
我是一名优秀的程序员,十分优秀!