好吧,我有这个 css 代码,这是用于我和我的朋友托管的网站。但是自从它结束以来,我们收到了一些关于 IE 用户的小抱怨,我不知道如何使用 IE 浏览器来实现这一点,有人可以帮我解决这个问题吗?我听说这不应该那么难,但我不知道从哪里开始。
#table1 {
font-family: open sans condensed;
background-color: #FFF;
border-collapse: collapse;
margin: auto;
padding: 100%;
}
#table11 {
font-family: open sans condensed;
background-color: #FFF;
border-collapse: collapse;
margin: auto;
}
th {
font-family: open sans condensed;
background-color: #CCC;
font-size: 25px;
border-style: solid;
border-width: 3px;
box-shadow: 0px 0px 8px #FFF;
border-color: black;
text-align: left;
vertical-align: bottom;
}
td {
background-color: #FFF;
border-style: solid;
border-width: 3px;
box-shadow: 0px 0px 8px #FFF;
border-color: black;
text-align: left;
vertical-align: bottom;
}
/*#table {
top: -500px;
/*Z-index: 19999px;
background-color: #FFF;
border-style: solid;
border-width: 3px;
box-shadow: 0px 0px 8px #FFF;
border-color: black;
text-align: left;
vertical-align: bottom;
} This does nothing but it ruins the CSS if not commmented*/
a:link {
font-size: 20px;
vertical-align: middle;
color: #A00000 ;
font-family: julius sans one;
font-weight: 900px;
text-decoration: none;
vertical-align: bottom;
}
a:visited {
color: #000;
vertical-align: middle;
text-decoration: none;
vertical-align: bottom;
}
a:hover {
color: rgb(129,129,129);
font-size: 20px;
vertical-align: middle;
text-decoration: underline;
vertical-align: bottom;
}
a:active {
color: #A00000 ;
vertical-align: middle;
text-decoration: none;
vertical-align: bottom;
}
#buttonbox {
text-align: center;
margin-left: auto;
margin-right: auto;
width: 205px;
border-radius: 100px;
border: 1px;
border-style: solid;
border-color: #CCCCCC;
box-shadow: 0px 0px 9px 1px rgba(221,221,221,0.5);
background-image: linear-gradient(bottom, #04131A 24%, #282E2E 50%);
background-image: -o-linear-gradient(bottom, #04131A 24%, #282E2E 50%);
background-image: -moz-linear-gradient(bottom, #04131A 24%, #282E2E 50%);
background-image: -webkit-linear-gradient(bottom, #04131A 24%, #282E2E 50%);
background-image: -ms-linear-gradient(bottom, #04131A 24%, #282E2E 50%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.24, #04131A),
color-stop(0.5, #282E2E)
);
}
#buttonbox:hover {
text-align: center;
margin-left: auto;
margin-right: auto;
width: 205px;
border-radius: 100px;
border: 1px;
border-style: solid;
border-color: #CCC;
box-shadow: 0px 0px 9px 1px rgba(221,221,221,0.5) inset;
background-image: linear-gradient(bottom, #04131A 24%, #282E2E 50%);
background-image: -o-linear-gradient(bottom, #04131A 24%, #282E2E 50%);
background-image: -moz-linear-gradient(bottom, #04131A 24%, #282E2E 50%);
background-image: -webkit-linear-gradient(bottom, #04131A 24%, #282E2E 50%);
background-image: -ms-linear-gradient(bottom, #04131A 24%, #282E2E 50%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.24, #04131A),
color-stop(0.5, #282E2E)
);
}
#buttonbox:active {
text-align: center;
margin-left: auto;
margin-right: auto;
width: 205px;
border-radius: 100px;
border: 1px;
border-style: solid;
border-color: #DDD;
box-shadow: 0px 0px 9px 15px #CCC inset;
background-image: linear-gradient(bottom, #04131A 24%, #282E2E 50%);
background-image: -o-linear-gradient(bottom, #04131A 24%, #282E2E 50%);
background-image: -moz-linear-gradient(bottom, #04131A 24%, #282E2E 50%);
background-image: -webkit-linear-gradient(bottom, #04131A 24%, #282E2E 50%);
background-image: -ms-linear-gradient(bottom, #04131A 24%, #282E2E 50%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.24, #04131A),
color-stop(0.5, #282E2E)
);
}
#button {
font-family: open sans condensed;
color: #4d4d4d;
font-size: 25px;
}
#button:hover {
font-family: open sans condensed;
color: #8d8d8d;
font-size: 25px;
text-decoration: none;
}
#div1 {
}
#body {
background: rgb(33, 133, 197) url('images/escheresque_ste.png');
margin: auto;
top: 30px;
}
#submit {
width: 155px;
float: right;
}
#register {
vertical-align: middle;
margin: auto;
}
但目前我不知道它是否与 IE 浏览器兼容,因为它使用了一些新的 CSS3 样式。还要注意我对 CSS3/CSS 有点陌生,但如果你们能在这里帮助我,我将非常感激。这里是 HTML/PHP(不要抱怨过时的 PHP 我正在处理它):
<?php
//Connects to the Database
include ('db.php');
//Starts a query to fetch the data from the table
$data = mysql_query("SELECT * FROM hf_osu") or die(mysql_error());
if(!$data) {
echo "3rr0rz";
exit;
}
?>
<html>
<head>
<link rel="stylesheet" type="text/css" href="css.css">
<link href='http://fonts.googleapis.com/css?family=Lobster|Fjalla+One|Julius+Sans+One|Passion+One:400,700,900|Lobster+Two:400,400italic,700,700italic|Open+Sans+Condensed:300,300italic,700&subset=latin,latin-ext,cyrillic-ext,cyrillic,vietnamese,greek,greek-ext' rel='stylesheet' type='text/css'>
</head>
<body id="body">
<div id="buttonbox">
<a href="/register.php" target="_blank" id="button">Register here</a>
</div>
<!--Writes the table and data.-->
<table id="table1">
<th>Hackforums Name</th>
<th>Osu! name</th>
<?php while($info = mysql_fetch_array($data)) : ?>
<tr>
<td><a href="<?php echo $info['Hackforums_PLink'] ?>"><?php echo $info ['Hackforums_UName'] ?></a></td>
<td><a href="<?php echo $info['Osu_PLink'] ?>"><?php echo $info ['Osu_UName'] ?></a></td>
</tr>
<?php endwhile; ?>
</table>
<!--<table id="table1">
<tr >
<th>Hackforums Name</th>
<th>Osu! Name</th>
</tr>
<tr>
<td><a href="http://www.hackforums.net/member.php?action=profile&uid=1096116">agsking</a> </td> <td><a href="http://osu.ppy.sh/u/agsking">agsking</a></td>
</tr>
<tr>
<td><a href="http://www.hackforums.net/member.php?action=profile&uid=746220">Hentai</a> </td><td> <a href="http://osu.ppy.sh/u/hfhentai">HFHentai</a></td>
</tr>
<tr>
<td><a href="http://www.hackforums.net/member.php?action=profile&uid=1464743">Kirito</a> </a></td> <td><a href="http://osu.ppy.sh/u/ScumbagSup">ScumbagSup</a></td>
</tr>
<tr>
<td><a href="http://www.hackforums.net/member.php?action=profile&uid=1074228">Ryuuji Takasu</a> </td> <td><a href="http://osu.ppy.sh/u/Plainside">Plainside</a></td>
</tr>
</table>-->
</body>
</html>