gpt4 book ai didi

html - Box-Shadow 没有出现?

转载 作者:行者123 更新时间:2023-11-28 18:02:11 25 4
gpt4 key购买 nike

在这个页面上,box-shadow 样式似乎没有出现,但这只是添加超链接后的一个问题。请看代码。

盒子阴影在 Chrome 中似乎工作正常,这个问题主要出现在 Internet Explorer 中。

box-shadow 围绕着 DIV ID="container"。

感谢您的帮助!

这是页面的 HTML..

`<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Home</title>
<link rel="stylesheet" type="text/css" href="stylesheet.css">
</head>

<body>
<div id="container">
<div id="header">
<div id="logo">
<img src="images/logo.png">
</div>
<div id="title">
<h1>FOOTBALL MANAGER</h1>
<h2>HOME</h2>
</div>
</div>
<div id="nav">
<a href="index.html">Home</a>
<a href="how_to_install.html">How To Install</a>
<a href="where_to_buy.html">Where To Buy</a>
<a href="about_us.html">About Us</a>
<a href="contact_us.html">Contact Us</a>
</div>
<div id="mheading">
<h4>Heading</h4>
</div>
<div id="fmlogo">
<p>fmlogo</p>
</div>
<div id="footer">
<span>
Copyright 2013 Top Notch Multi-Media
</span>
<span id="update">
Site last updated at 22:15 23 November 2013
</span>
</div>
</div>
</body>
</html>
`

还有 CSS..

'
@charset "utf-8";


body {
height:1100px;
background-color:#999; /*needs defining in house style */
margin:0px;
padding:0px;

}

h1 {
font-family: Verdana;
font-size: 53px;
text-shadow: 1px 1px 7px #000;

}

h2 {
font-family:Verdana;
font-size:35px;
text-shadow: 1px 1px 7px #000;

}

h3 {
font-family: Verdana;
font-size: 20px;

}

h4 {
font-family:Verdana;
font-size:35px;
margin: 0px;

}

#container {
width:950px;
height:1100px;
margin:0 auto;
background-color:#FFF;
border-style:solid;
border-width:1px;
border-color:#000;
/*order goes Horizontal offset, Vertical offset, Blur radius, Spread distance, Color */
box-shadow:0px 0px 100px 10px #000;

}

#header {
position:relative;
height:170px;
background-color: #30A7BF;
margin:0px auto;
padding: 1px;

}

#title {
position:absolute;
top: 15px;
left: 315px;

}

#nav {
position:relative;
height: 60px;
margin: 0 auto;
background-color:#CF6;
border-style: solid;
border-color: black;
border-bottom-width:2px;
border-top-width:2px;
border-right-width:1px;
border-left-width:1px;
text-align: center;

}

a {
position: relative;
top: 3px;
display: inline-block;
margin: -3px;
height: 56px;
width: 188px;
background-color: #E39734;
border-style: solid;
border-width: 2px;
border-color: #000;
text-align: center;
font-family: Verdana;
font-size: 20px;
line-height: 55px;
}

#button {
position: relative;
top: 3px;
display: inline-block;
margin: -3px;
height: 56px;
width: 188px;
background-color: #E39734;
border-style: solid;
border-width: 2px;
border-color: #000;
text-align: center;
font-family: Verdana;
font-size: 20px;
line-height: 55px;
}

.button:hover {
background-color: #BD7E2D;
}

a:link {
text-decoration: none;
color: #000;

}

a:visited {
text-decoration: none;
color: #000;

}

a:hover {
text-decoration: underline;
color: #636363;

}

#logo {
position:absolute;
height:130px;
width:340px;
top:17px;
left: -10px;
border-style: solid;
border-width:0px;
border-color:black;

}

img {
width: 100%;

}

#mheading {
position:relative;
top: 10px;
left: 5px;
width: 940px;
height: 50px;
border-style: solid;
border-width: 1px;
border-color: #000;
text-align:center

}

#fmlogo {
position: relative;
margin: 0px;
top: 649px;
margin: 0 auto;
width: 940px;
height: 100px;
border-style: solid;
border-color: #000;;
border-width: 1px;
text-align: center;

}

#footer {
position: relative;
margin: 0px;
top: 659px;
width: 940px;
height: 30px;
background-color: #9F3;
border-style: solid;
border-color: black;
border-top-width: 1px;
border-right-width: 0px;
border-bottom-width: 1px;
border-left-width: 0px;
padding-left: 5px;
padding-right:5px;
padding-top: 20px;
font-family: Verdana, Geneva, sans-serif;
font-size: 10px;

}

#update {
float: right;

}
'

最佳答案

您使用的是什么版本的 IE?如果是 IE 9 或更低版本,则必须在容器类 css 声明中使用以下内容:

border-collapse: separate;

关于html - Box-Shadow 没有出现?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20248667/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com