CSS3如何使div层appDiv层居中

html-css038

CSS3如何使div层appDiv层居中,第1张

和css2一样的:

body上设置text-align:center

最外面套作所有内容的div的css上设置:margin:0 autotext-align:left

网页上禁止复制主要靠JavaScript来实现。

<BODY oncontextmenu="return false" onselectstart="return false"

ondragstart="return false" onbeforecopy="return false" oncopy=document.selection.empty() onselect=document.selection.empty()>

-----------------------------------------------

防止复制的js

-----------------------------------------------

<SCRIPT language=JavaScript1.2>

function disableselect(e){

return false}

function reEnable(){return true

}

file://if IE4+

document.onselectstart=new Function ("return false")

file://if NS6

if (window.sidebar){

document.onmousedown=disableselect

document.onclick=reEnable

}

</SCRIPT>

<SCRIPT language=JavaScript type=text/JavaScript>

<!--

function MM_reloadPage(init) {//reloads the window if Nav4 resized

if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {

document.MM_pgW=innerWidthdocument.MM_pgH=innerHeightonresize=MM_reloadPage}}

else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload()

}

MM_reloadPage(true)

//-->

</SCRIPT>

-------------------------------------------------------

防止下载的js

-------------------------------------------------------

<noscript><iframe src=""></iframe></noscript>

--------------------------------------------------------

下面是防止右键的js:

--------------------------------------------------------

<script language="JavaScript">

<!--

if (window.Event)

document.captureEvents(Event.MOUSEUP)

function nocontextmenu() {

event.cancelBubble = true

event.returnValue = false

return false

}

function norightclick(e) {

if (window.Event){

if (e.which == 2 || e.which == 3)

return false

}else{

if (event.button == 2 || event.button == 3){

event.cancelBubble = true

event.returnValue = false

return false

}

}

}

document.oncontextmenu = nocontextmenu// for IE5+

document.onmousedown = norightclick// for all others

//-->

</script>

在前端代码中,通常使用div+css来布局用户页面。通过这种组合方式,可以将网页的内容与样式分离,提高了前端开发的速度。下面就来使用div+css来实现两种导航栏的编写吧!

1.导航栏一:

<div id='menu'>

<a href="#">链接</a>|

<a href="#">链接</a>|

<a href="#">链接</a>|

<a href="#">链接</a>|

<a href="#">链接</a>

</div>

*{margin:0padding:0}

#menu{

min-width:400px

height:20px

background:#pink

text-align:center

line-height:20px

font-size:10px

}

#menu a{

padding:10px

color:blue

text-decoration:none

font-weight:bold

}

#menu a:hover{color:red}

2.导航栏二:

<ul id="menu">

<li><a href="#">首页</a></li>

<li><a href="#">首页</a></li>

<li><a href="#">首页</a></li>

<li><a href="#">首页</a></li>

<li><a href="#">首页</a></li>

<li><a href="#">首页</a></li>

</ul>

*{margin:0padding:0}

body{min-width:500px}

li{list-style:none}

body{text-align:center}

a{text-decoration:none}

a:hover{color:#BA2636}

#menu{ width:100%height:3.75rembackground:#00A2CA}

#menu li{display:inlineheight:3.75rem}

#menu li a{display:inline-blockpadding:0 1.25remheight:3.75remline-height:3.75rem

color:#FFFfont-weight:boldfont-size:1rem}

#menu li a:hover{background:#0095BB}