我有這樣的CSS樣式代碼:我怎樣才能在我的網站幻燈片放映中心位於屏幕中心?
/* null margins and padding to give good cross-browser baseline */
html,body,address,blockquote,div,
form,fieldset,caption,
h1,h2,h3,h4,h5,h6,
hr,ul,li,ol,ul,dd,dt,dl,
table,tr,td,th,p,img {
margin:0;
padding:0;
}
img,fieldset {
border:none;
}
hr {
display:none;
/*
HR in my code are for semantic breaks in topic/section, NOT
style/presenation, so hide them from screen.css users
*/
}
@media (max-width:600px) {
* {
-webkit-text-size-adjust:none;
-moz-text-size-adjust:none;
-ms-text-size-adjust:none;
}
}
body {
font:normal 85%/150% "segoe ui",helvetica,sans-serif;
background-image: url("CB1.html");
//position:fixed; //(relative, absolute, static*)
//top: 120px;
//left: 120px;
//bottom: 120px;
width: 960px; margin: 0 auto;
}
.ss_scripted img {
display:none;
}
.ss_scripted .ss_show {
display: block;
}
#slideShow img {
margin:0 auto;
}
#slideCounter {
text-align:center;
padding:0.25em 1em;
font:bold 200%/120% consolas,courier,monospace;
color:#C00;
}
#slideControls {
width:512px;
padding:0.5em 0;
margin:0 auto;
}
#slideControls a {
float:left;
padding:0.25em 0.6em;
text-decoration:none;
color:#000;
background:#EEE;
border:2px solid #666;
-webkit-border-radius:1em;
-moz-border-radius:1em;
border-radius:1em;
-webkit-box-shadow:
inset 0 -0.5em 1em rgba(0,0,0,0.3),
0 0 1px #000;
-moz-box-shadow:
inset 0 -0.5em 1em rgba(0,0,0,0.3),
0 0 1px #000;
box-shadow:
inset 0 -0.5em 1em rgba(0,0,0,0.3),
0 0 1px #000;
}
#slideControls a:active,
#slideControls a:focus,
#slideControls a:hover {
background:#FFF;
}
#slideControls .next {
float:right;
}
我在體內改變的部分:
body {
font:normal 85%/150% "segoe ui",helvetica,sans-serif;
background-image: url("CB1.html");
//position:fixed; //(relative, absolute, static*)
//top: 120px;
//left: 120px;
//bottom: 120px;
width: 960px; margin: 0 auto;
}
無標記3行並添加寬度和餘量0汽車 如果我使用此3行沒有寬度和邊距,幻燈片顯示在左下角。
現在幻燈片顯示在中間的頂部。但我想它是在屏幕中心不是中間的頂部:
我應該改變/添加什麼?
你必須從頂部給予保證金。 – 2014-11-21 06:53:08