<div>是可以嵌套的,网页布局的实现就是通过层层嵌套进而最终形成各个部分。
问题:
问题1:如何实现缩放时页面始终展示在浏览器的中间?
答:可以在css中自定义宽和高和定义{margin:0 auto;}
问题二:如何使文字一直固定在div块中,缩放时也不会跑到div下面?
答:使用{line-height:**;}设置固定的行距,从而无论页面缩小或者放大,行距一直固定在哪个块,从而不会跑出div;
问题三:使用一张图当做页面背景时,欲使页面百分之百显示,没有重叠,并且不能滑动要怎么做。
答:可以分别使用一下css代码:{background-size:100%;}{background-repeat:no-repeate;}{background-attachment:fixed;
问题四:如何实现div元素换行而不占据整行?
答:除了为div设置固定宽度的方法外,还可以在父级元素加上代码:display: flex;也可以在子div中将display设置为inline-table也可以实现div不换行在循环添加模块时较有作用,如果宽度超过设置的宽度使将会自动。
问题5:要防止a标签换行应该怎么做?
答:在css中加入代码:.alink{white-space:nowrap;}
技巧:
小技巧1:在开始写网页时使用“*{margin:0; padding 0;}”初始化比较方便。
小技巧2:给DIV加上overflow:hidden;可以解决一些不必要的问题。
小技巧3:页面的最小宽度 min -width是个非常方便的CSS命令,它可以指定元素最小也不能小于某个宽度,这样就能保证排版一直正确。(但不适用于IE,)
小知识:
小知识1:a:hovor{}可以设置a标签在鼠标放上去的变化,同时a标签内的盒子会自动带上可选标志,除此之外,{cursor: pointer;}也可以让盒子带上可选标志。
小知识2:{border-radius: *px;}可为边框设置圆角。
小知识3:{}line-height: *px;}可让文字垂直居中,{text-align:left/center/right;}可让文字水平位于盒子左边/中心/右边;
小知识4:想为链接文本添加边框,使鼠标放上去时显示边框,可用代码:a hover:{outline:1px solid black;}
小知识5:想为链接添加图标,可以用:a{background:url()center right no-repreat; padding-right:13px;},仅需要计算图标的大小即可。
小知识6: li中内容超过长度后以省略号的显示方法
li {
width:200px;
white-space:nowrap;
text-overflow:ellipsis;
-o-text-overflow:ellipsis;
overflow: hidden;
}
小知识7:CSS背景透明:全透明代码:{background:transparent} 半透明代码:{filter:alpha(opacity=80);-moz-opacity:0.8;}