我国的政策迫使我为我的网站添加警告横幅Cookie。我把它放在下面的代码中：
<script src="http://j.maxmind.com/app/geoip.js"></script>
<div id="cookie" style="display:none;position:relative;left:0px;right:0px;top:0px;width:100%;min-height:30px;background: #000000;color:#ffffff;z-index: 99999;">
<div style="width:100%;position:absolute;padding-left:600px;font-family:verdana;font-size:9px;top:30%;">
Usamos cookies propias y de terceros para mejorar la navegación. Si continua navegando consideramos que acepta el uso de cookies.
<a href="javascript:void(0)" style="padding:4px;background:#4682B4;text-decoration:none;color:#fff;" onclick="PonerCookie();"><b>OK</b></a>
<a href="PAGINA" target="_blank" style="padding-left:5px;text-decoration:none;color:#000000;">Más información</a>
</div>
</div>
<script>
function getCookie(c_name){
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1){
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1){
c_value = null;
}else{
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1){
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start,c_end));
}
return c_value;
}
function setCookie(c_name,value,exdays){
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}
if(geoip_country_code()=="ES" && getCookie('aviso')!="1"){
document.getElementById("cookie").style.display="block";
}
function PonerCookie(){
setCookie('aviso','1',365);
document.getElementById("cookie").style.display="none";
}
</script>
但我希望这篇文章能够完全集中在我的浏览器上，并且可以进入任何计算机并进入网站，该网站总是完全出现，文本位于中心。我怎么能这样做？感谢
我的HTML：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>BLOG</title>
<!-- Attach our CSS -->
<link rel="stylesheet" href="orbit-1.2.3.css"/>
<link rel="stylesheet" href="demo-style.css"/>
<!-- Attach necessary JS -->
<script type="text/javascript" src="jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="jquery.orbit-1.2.3.min.js"></script>
<!--[if IE]>
<style type="text/css">
.timer { display: none !important; }
div.caption { background:transparent; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000,endColorstr=#99000000);zoom: 1; }
</style>
<![endif]-->
<!-- Run the plugin -->
<script type="text/javascript">
$(window).load(function() {
$('#featured').orbit();
});
</script>
<link href="<?php $_SERVER['DOCUMENT_ROOT']?>/estilo-pagina-css" rel="stylesheet" type="text/css" />
<style type="text/css">
#contenedor {
width: 900px;
margin: 0 auto;
height: 100%;
background-color: #000000;
}
</style>
<script src="http://j.maxmind.com/app/geoip.js"></script>
<div id="cookie" style="display: fixed;background: #00000;overflow: hidden;color: #FFF;padding: 10px;">
<div style="padding:4px;background:#000000;text-decoration:none;color:#fff;">
Usamos cookies propias y de terceros para mejorar la navegación. Si continua navegando consideramos que acepta el uso de cookies.
<a href="javascript:void(0)" style="padding:4px;background:#4682B4;text-decoration:none;color:#fff;" onclick="PonerCookie();"><b>OK</b></a>
<a href="PAGINA" target="_blank" style="padding-left:5px;text-decoration:none;color:#ffffff;">Más información</a>
</div>
</div>
<script>
function getCookie(c_name){
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1){
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1){
c_value = null;
}else{
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1){
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start,c_end));
}
return c_value;
}
function setCookie(c_name,value,exdays){
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}
if(geoip_country_code()=="ES" && getCookie('aviso')!="1"){
document.getElementById("cookie").style.display="block";
}
function PonerCookie(){
setCookie('aviso','1',365);
document.getElementById("cookie").style.display="none";
}
</script>
</head>
<body>
<div id="contenedor">
<div id="cabecera" >
<object id="EdgeID" type="text/html" width="900" height="167" data-dw-widget="Edge" data="head/Assets/head.html">
</object>
</div>
<div id="botonera"><?php include($_SERVER['DOCUMENT_ROOT']."/botonera.php"); ?></div>
<div id="sombra"></div>
<div id="para-contenido"></div>
<div id="centro">
<div id="featured">
<div class="content" style="">
<h1></h1>
<h3></h3>
</div>
<a href=""><img src="imagenes-presentacion/66.jpg" /></a>
<img src="imagenes-presentacion/65B.jpg" />
<img src="imagenes-presentacion/38.jpg" />
<img src="imagenes-presentacion/8.jpg" />
<img src="imagenes-presentacion/9.jpg" />
<img src="imagenes-presentacion/12.jpg" />
<img src="imagenes-presentacion/7.jpg" />
<img src="imagenes-presentacion/65.jpg" />
<img src="imagenes-presentacion/65B.jpg" />
<img src="imagenes-presentacion/16.jpg" />
<img src="imagenes-presentacion/29.jpg" />
</div>
</div>
<div id="para-contenido2"><?php include($_SERVER['DOCUMENT_ROOT']."/presentacion.php"); ?></div>
<div id="pie"><?php include($_SERVER['DOCUMENT_ROOT']."/pie.php"); ?></div>
</div>
</body>
</html>
CSS：
<style type="text/css">
#contenedor {
width: 900px;
margin: 0 auto;
height: 100%;
background-color: #000000;
display: inline;
}
body {
margin: 0;
padding: 0;
height: 100%;
background-image: url(<?php $_SERVER['DOCUMENT_ROOT']?>/imagenes-blog/fondo1.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
background-position: top center;
}
#cabecera {
width: 900px;
height: 167px;
background-color: #CCC;
}
#sombra {
width: 900px;
height: 21px;
background-image: url(<?php $_SERVER['DOCUMENT_ROOT']?>/imagenes-blog/sombra.jpg);
}
#botonera {
width: 900px;
height: 21px;
background-image: url(<?php $_SERVER['DOCUMENT_ROOT']?>/imagenes-blog/2blog.jpg);
}
#pie {
clear: both;
width: 900px;
height: 51px;
background-image: url(<?php $_SERVER['DOCUMENT_ROOT']?>/imagenes-blog/4blog.jpg);
}
#centro {
width: 900px;
height: 100%;
background-image: url(<?php $_SERVER['DOCUMENT_ROOT']?>/imagenes-blog/fondo.jpg);
}
#para-contenido2 {
width: 900px;
height: 100%;
background-image: url(<?php $_SERVER['DOCUMENT_ROOT']?>/imagenes-blog/fondo.jpg);
}
#centro_galeria {
width: 900px;
height: 100%;
padding-top: 15px;
background-image: url(<?php $_SERVER['DOCUMENT_ROOT']?>/imagenes-blog/fondo.jpg);
}
答案 0 :(得分：0)
您想使用display: fixed。这将始终将cookie div作为横幅保持在顶部，直到用javascript删除。
除非你的意思是你希望它垂直和水平居中？这可以做到，但横幅对你的用户来说不那么烦人了。
有一个小提琴！ - Fiddle Link!
HTML
<div id="cookie">
<div>cookies text
<a href="javascript:void(0)" onclick="PonerCookie();"><b>OK</b></a>
<a href="PAGINA" target="_blank">Más información</a>
</div>
</div>
CSS
#cookie {
display: fixed;
background: #4682B4;
overflow: hidden;
color: #FFF;
padding: 10px;
}
#cookie a {
padding:4px;
background:#4682B4;
text-decoration:none;
color:#fff;
float: right;
}