<!DOCTYPE头部声明、javascript、css 之间难以解决的问题

Question

问题描述如下：有一些 javascript，必须删除 <!DOCTYPE头部声明 才可以正常运行如滚动窗口  代码跟帖 附上有一些css，必须加上 <!DOCTYPE头部声明 才可以正常运行如 margin:0px auto;      若改用父元素 text-align:center; 这个属性 会一直传递下去，造成子元素好多不该居中的地方也居中了现在我的页面 既有 滚动窗口，又需要居中，如何解决矛盾？？请指教

Answer 1

滚动窗口
<script language="javascript">
window.onload=getBulletin;
window.onresize =  resizeBulletin;
window.onerror = function(){};
var objTimer;function getBulletin() {
try {
document.all.bulletin.style.top = parseInt(document.body.scrollTop,10) + document.body.clientHeight + 10;
document.all.bulletin.style.left = document.body.scrollLeft + document.body.clientWidth - document.all.bulletin.style.pixelWidth;
document.all.bulletin.style.visibility = "visible";
objTimer = window.setInterval("moveBulletin()",1);
}
catch(e){}
}function moveBulletin() {
try {
if (parseInt(document.all.bulletin.style.top,10) <= (document.body.clientHeight - parseInt(document.all.bulletin.offsetHeight,10) + parseInt(document.body.scrollTop,10))) {
window.clearInterval(objTimer);
objTimer = window.setInterval("resizeBulletin()",1);
}
document.all.bulletin.style.top = parseInt(document.all.bulletin.style.top,10) - 1;
document.all.bulletin.style.left = document.body.scrollLeft + document.body.clientWidth - document.all.bulletin.style.pixelWidth;
}
catch(e){}
}function resizeBulletin() {
try {
document.all.bulletin.style.top = document.body.clientHeight - parseInt(document.all.bulletin.offsetHeight,10) + parseInt(document.body.scrollTop,10);
document.all.bulletin.style.left = document.body.scrollLeft + document.body.clientWidth - document.all.bulletin.style.pixelWidth;
}
catch(e){}
}function minimizeBulletin() {
if (objTimer)
window.clearInterval(objTimer);
winit();
oWin[0].minimize();
}function minIt() {
if (parseInt(document.all.bulletin.style.top,10) <= (document.body.clientHeight - parseInt(document.all.bulletin.offsetHeight,10) + parseInt(document.body.scrollTop,10)))
minimizeBulletin();
}function closeBulletin() {
if (objTimer)
window.clearInterval(objTimer);
document.all.bulletin.style.visibility='hidden';
}function closeIt() {
if (parseInt(document.all.bulletin.style.top,10) <= (document.body.clientHeight - parseInt(document.all.bulletin.offsetHeight,10) + parseInt(document.body.scrollTop,10)))
closeBulletin();
}
</script>
<script language="JavaScript1.2">
function lib_moveIt(x,y) {
this.x=x;
this.y=y;
this.css.left=x+document.body.scrollLeft+document.body.clientWidth-document.all.bulletin.style.pixelWidth;
this.css.top=y+document.body.scrollTop+document.body.clientHeight-document.all.bulletin.style.pixelHeight;
}function lib_moveBy(x,y) {
this.moveIt(this.x+x,this.y+y);
}function lib_showIt() {
this.css.visibility="visible";
}function lib_hideIt() {
this.css.visibility="hidden";
}function lib_slideIt(endx,endy,inc,speed) {
if (!this.slideactive) {
var distx = endx - this.x;
var disty = endy - this.y;
var num = Math.sqrt(Math.pow(distx,2) + Math.pow(disty,2))/inc;
var dx = distx/num;
var dy = disty/num;
this.slideactive = 1;
this.slide(dx,dy,endx,endy,speed);
}
}function lib_slide(dx,dy,endx,endy,speed) {
if (this.slideactive && Math.floor(Math.abs(dy))<Math.floor(Math.abs(endy-this.y))) {
this.moveBy(dx,dy);
slidTim=setTimeout(this.obj+".slide("+dx+","+dy+","+endx+","+endy+","+speed+")",speed);
}
else {
this.slideactive = 0;
oWin[0].hideIt();
if (endy!=0) {
initBulletinBar();
}
else if (Math.floor(Math.abs(dy))==Math.floor(Math.abs(endy-this.y))) {
initRestoredBulletin();
}
this.moveIt(endx,endy);
}
}var slidTim;function lib_obj2(obj,nest,dnest,ddnest,num) {
this.evnt=document.getElementById(obj);
this.css=this.evnt.style;
this.css.clip="rect(0,"+document.all.bulletin.style.pixelWidth+","+document.all.bulletin.style.pixelHeight+",0)";
this.moveIt=lib_moveIt;
this.moveBy=lib_moveBy;
this.showIt=lib_showIt;
this.hideIt=lib_hideIt;
this.slideactive=0;
this.slideIt=lib_slideIt;
this.slide=lib_slide;
this.obj = obj + "Object";
(this.obj + "=this");
return this;
}function winit() {
create_window();
setWindows();
}var oWin=new Object();function create_window() {
oWin[0]=new lib_obj2('bulletin');
oWin[0].lastx=oWin[0].x;
oWin[0].lasty=oWin[0].y;
oWin[0].minimize=win_minimize;
oWin[0].regwin=win_regwin;
oWin[0].state="reg";
}function win_regwin(m) {
if(!m) this.slideIt(this.lastx,this.lasty,15,15);
else this.moveIt(this.lastx,this.lasty);
this.state="reg";
}function win_minimize() {
if(this.state!="min") {
this.lastx=this.x;
this.lasty=this.y;
oWin[0].showIt();
this.slideIt(0,255,15,30);
this.state="min";
}
else {
document.all.bulletinBar.style.visibility = 'hidden';
oWin[0].showIt();
this.regwin();
}
}function setWindows() {
oWin[0].origx=0;
oWin[0].origy=0;
oWin[0].lasty=oWin[0].origy;
oWin[0].lastx=oWin[0].origx;
oWin[0].regwin();
}
</script>
<script language="javascript">
function initBulletinBar() {
document.all.bulletinBar.style.visibility = 'visible';
moveBulletinBar();
objTimer = window.setInterval("resizeBulletin()",150);
}var barTimer;function moveBulletinBar() {
var x_BulletinBar = document.body.scrollLeft + document.body.clientWidth - document.all.bulletinBar.style.pixelWidth;
var y_BulletinBar = document.body.scrollTop + document.body.clientHeight - document.all.bulletinBar.style.pixelHeight;
document.all.bulletinBar.style.top = y_BulletinBar;
document.all.bulletinBar.style.left = x_BulletinBar;
barTimer = setTimeout("moveBulletinBar()",1);
}
</script>
<script language="javascript">
function initRestoredBulletin() {
document.all.bulletin.style.visibility = 'visible';
if (barTimer)
clearTimeout(barTimer);
}
</script>
<SPAN id="bulletin" style="VISIBILITY: hidden; WIDTH: 325px; HEIGHT: 70px; POSITION: absolute; LEFT: -10px; TOP: 0px">
<TABLE cellSpacing=0 cellPadding=0 width="100%" bgColor=#336699 border=0>
<TR><TD style="font-size: 12px; color: #ffe020; padding-left: 4px; padding-top: 2px" width="100%"><!--小贴士--></TD>
<TD style="cursor: hand" title="最小化" onClick="javascript:minIt()">-<!--<img src="s.gif" width="13" height="14">--></TD>
<TD style="padding-right: 2px; cursor: hand" align=right title="关闭" onClick="javascript:closeIt()"><img src="c.jpg" width="13" height="13"></TD></TR>
<TR><TD align=center bgColor=#ffffff style="font-size:12px; border-left:1px solid #336699; border-right:1px solid #336699; border-bottom:1px solid #336699" colSpan=3><a href="/a/zhanlanhuiyi/20100309/1702.html"><img src="/templets/ad/link.jpg"/></a>
</TD></TR></TABLE></SPAN>
<SPAN id="bulletinBar" style="VISIBILITY: hidden; WIDTH: 128px; HEIGHT: 16px; POSITION: absolute; LEFT: 0px; TOP: 0px">
<TABLE cellSpacing=0 cellPadding=0 width="100%" bgColor=#336699 border=0>
<TR><TD style="font-size: 12px; color: #ffe020; padding-left: 4px; padding-top: 2px" width="100%"><!--小贴士--></TD>
<TD style="cursor: hand" title="往上还原" onClick="javascript:oWin[0].minimize()"><img src="s.gif" width="13" height="13"></TD>
<TD style="padding-right: 2px; cursor: hand" align=right title="关闭" onClick="javascript:document.all.bulletinBar.style.visibility='hidden'"><img src="c.jpg" width="13" height="13"></TD></TR></TABLE></SPAN><!--下面为一个ID为AdLayer的层（如ID名不为AdLayer，上面MoveLayer()内的AdLayer也要作相应修改），包括一张带链接的图片--> 　　<div id=AdLayer style='position:absolute; width:61px; height:59px; z-index:20; visibility:hidden; left: 600px; top: 300px;'> 　　<a href="http://www.ceeu.org"><img src='/templets/images/test.gif' border="0" height="60" width="60"></a> 　　</div> 

Answer 2

子层重写text-align属性
这样父辈的 text-align影响也就到这个子层为止

Answer 3

1，2 问题说明你的代码写的不规范。显然这是代码的问题，和头无关。请规范的书写js和css代码3的问题，是css定义的问题，叫做样式穿透，显然你应该从更小的范围去定义css样式