我最近在记事本中使用了一些HTML进行了测试设计,并且效果非常好.我决定保留设计并将网站扩展为多页网站 - 因此CSS需要进入外部CSS文件.我做了这个,并立即CSS停止为我的页面工作.
我尝试将CSS编码粘贴回HTML文件,但仍然无法正常工作.我花了几个小时试图解决问题,但它仍然不适合我.
我错过了一个明显的错误吗？
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="Test">
<meta name="keywords" content="test">
<link rel="icon" href="favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<title>West</title>
<style type="text/css">
html, body {
height100%;
margin 0px;
padding 0px;
}
video#bgvid {
position fixed;
right 0;
bottom 0;
min-width 100%;
min-height 100%;
width auto;
height auto;
z-index -100;
background url(imgillamal.png) no-repeat;
background-size cover;
}
#wrapper {
background-color rgba(255, 255, 255, 0.7);
-webkit-box-shadow 0px 0px 54px -7px rgba(0, 0, 0, 0.75);
-moz-box-shadow 0px 0px 54px -7px rgba(0, 0, 0, 0.75);
box-shadow 0px 0px 54px -7px rgba(0, 0, 0, 0.75);
width 800px;
height 100%;
min-height 100%;
margin auto;
}
#header {
width 800px;
height 230px;
margin auto;
padding-top 2px;
}
.map_image {
display block;
width 800px;
height 230px;
position relative;
background-position 0 0;
background-repeat no-repeat;
}
.map_image .map_link {
display block;
position absolute;
text-indent -999em;
overflow hidden;
}
.map_image #map_link_0 {
width 133px;
height 131px;
top 50px;
left 92px;
}
.map_image #map_link_1 {
width 156px;
height 112px;
top 58px;
left 536px;
}
.map_image #map_link_2 {
width 54px;
height 46px;
top 54px;
left 34px;
}
.map_image #map_link_3 {
width 59px;
height 51px;
top 129px;
left 226px;
}
.map_image1 {
display block;
width 800.1818182468414px;
height 50.18181824684143px;
position relative;
background-position 0 0;
background-repeat no-repeat;
}
.map_image1 .map_link1 {
display block;
position absolute;
text-indent -999em;
overflow hidden;
}
.map_image1 #map_link_4 {
width 64.36363649368286px;
height 39.36363649368286px;
top 3.90625px;
left 141.9033966064453px;
}
.map_image1 #map_link_5 {
width 95.36363649368286px;
height 36.36363649368286px;
top 7.897705078125px;
left 416.9033966064453px;
}
.map_image1 #map_link_6 {
width 81.36363649368286px;
height 37.36363649368286px;
top 9.90057373046875px;
left 226.9033966064453px;
}
.map_image1 #map_link_7 {
width 79.36363649368286px;
height 36.36363649368286px;
top 6.903411865234375px;
left 325.90907287597656px;
}
.map_image1 #map_link_8 {
width 111.36363649368286px;
height 36.36363649368286px;
top 0.909088134765625px;
left 524.9005279541016px;
}
#content {
}
#social {
bottom0;
positionfixed;
z-index150;
_positionabsolute;
_topexpression(eval(document.documentElement.scrollTop+ (document.documentElement.clientHeight-this.offsetHeight)));
width 800px;
height72px;
margin-bottom 20px;
text-align center;
}
.outline {
border 2px solid #80b78f;
box-shadow 3px 3px 5px rgba(0, 0, 0, 0.6);
-moz-box-shadow 3px 3px 5px rgba(0, 0, 0, 0.6);
-webkit-box-shadow 3px 3px 5px rgba(0, 0, 0, 0.6);
}
#sociallinks {
height 8-px;
margin-top 525px;
text-align center;
font-size 20px;
font-family Cooper Std Black;
letter-spacing 5px;
}
#logolinks2 {
text-align center;
}
#twitterfeed {
}
</style>
</head>
您还应该附加body标签内的内容.关于CSS,它不会工作,因为你在很多地方遗漏了":",例如,
border 2px solid #80b78f;
should be
border:2px solid #80b78f;