)（指定页面总体属性，注意，在这里可以添加鼠标效果．最简单的鼠标效果代码：CURSOR: url('http://xiaobing8155.googlepages.com/Plusnaarrow.cur')）overflow-y:autooverflow-x:hiddenmargin:0padding:0} （这四个代码对于要移动空间导航栏的一定要记得使用，如要把导航栏移动到中间，不使用此代码将使页面变宽，出现横向拉条，影响美观．简单的说下overflow：overflow : visible | auto | hidden | scroll 取值：visible : 默认值。不剪切内容也不添加滚动条。假如显式声明此默认值，对象将以包含对象的 window 或 frame 的尺寸裁切。并且 clip 属性设置将失效 auto : 在必需时对象内容才会被裁切或显示滚动条 hidden : 不显示超过对象尺寸的内容 scroll : 总是显示滚动条 ）#main {BACKGROUND: url(
) no-repeat 8px 0px} （这个是指定空间名称那部分属性的，如添加背景图片之类的．百度默认CSS里没有这个代码，可以自己加入，方便设计空间）#header{ HEIGHT: 380pxmargin-left:10px} （这个是很重要的，如果用#main加空间名称那里的背景图片，千万记得这里的高度要和背景图片的高度一样．margin-left检索或设置对象左边的外补丁．）#header div.tit a.titlink{font-size:0pxcolor:#fffffftext-decoration:none}#header div.tit a.titlink:visited{font-size:0pxcolor:#fffffftext-decoration:none}#header div.desc{top:217pxleft:300pxcolor:#fffffffont-size:12px}#header div.tit{top:197pxleft:300px}#tab{top:14pxleft:-35pxbackground:transparent} （这个代码是空间导航栏位置的，你可以修改TOP和left来移动导航拦位置．）#tab a.on,#tab a.on:link,#tab a.on:visited{margin-top:3pxline-height:19pxbackground-color:transparentcolor:#fffffffont-size:14px} （导航栏文字的背景）#tab span{color:#fffffffont-size:14px} （导航栏字体颜色和大小）#tab a:link{color:#fffffftext-decoration:nonefont-size:14px} （导航栏被点击后的属性）#tab a:visited{color:#fffffftext-decoration:nonefont-size:14px}#tab2{background:transparent}#tab2 span{color:#000000font-size:12pxfont-weight:bold}#tab2 a{font-size:12px}#tab2 a:link{color:#0000CC}#tab2 a:visited{color:#0000CC} 对于这段代码本人没有研究.stagepad {width:600pxmargin-left:55px }.stagepad a:link{text-decoration:nonefont-weight:bold}.stagepad a:visited{text-decoration:nonefont-weight:bold}#layout {width:974pxmargin-left:0pxbackground:url(
) no-repeat bottom -18pxpadding-bottom:50px}（这个是页面下方的背景图片，大家可以看我的空间下方有个页面制作：午夜浪儿的字样，靠的就是这个代码．）.stage {background:url(
) no-repeat 0px 10px}（这个代码上面已经有讲解，就是设置导航栏下部分的背景图片的）#layout td.c2t3{padding-right:0pxpadding-top:0pxwidth:250}#layout td.c2t1{padding-left:170pxpadding-top:0pxwidth:600pxborder-right:#930000 0px solid}#layout td.c2t2{width:60px}（此段代码上面已经有详细讲解）#comm_info{color:#fffffffont-family:Arialtext-align:centerpadding-top:19pxTEXT-INDENT:px}#comm_info div.line{margin-top:0pxborder-top:0px solid #5C85BB}#comm_info a{color:#fffffftext-decoration:none}#comm_info a:visited{color:#fffffftext-decoration:none}#page{height:30pxfont-size:12pxfont-family:Arialtext-align:center}#page span{padding:3pxcolor:#1a4a8afont-size:14pxfont-weight:bold}#page a.pc{color:#fffffffont-size:14pxfont-weight:bold}#page a.pc:visited{color:#ffffff}#page a.pi{padding:3pxcolor:#fffffffont-size:14px}#page a.pi:visited{color:#ffffff}.mod{margin-bottom:20px}.modhandle{cursor:move}.modth{height:0px}.modhead{padding:0px 4px 0 4pxpadding-top:pxpadding-bottom:3pxLINE-HEIGHT:17pxborder-bottom:#ffffff1px solidtext-align:center}.modopt{padding:4px 4px 0 0}.modtit{color:#fffffffont-size:14pxfont-weight:bold}a.modtit{color:#ffffff}a.modtit:visited{color:#ffffff}.modtitlink{color:#fffffffont-size:12pxfont-weight:bold}a.modtitlink{color:#fffffftext-decoration:none}a.modtitlink:visited{color:#fffffftext-decoration:none}a.modtitlink:hover{color:#FF5100text-decoration:none}.modact{color:#fffffffont-size:12pxtext-align:center}a.modact:link{color:#ffffff}a.modact:visited{color:#ffffff}.modbox{padding:0px 0px 0 0px}.modtl{background:url(
) 0px -1px}.modtc{background:url(
)}.modtr{background:url(
) -2px -1px}.modbl{line-height:1px}.modbc{line-height:1px}.modbr{line-height:1px}（本段代码请参考百度空间官方CSS帮助）#mod_bloglist{padding-top:0px}#m_blog {padding-top:0px}（指定文章内容距离#header部分的距离．）（下面的代码请大家参考百度官方CSS帮助）#m_blog div.cnt a {text-decoration:nonecolor:#344500}#m_blog div.cnt a:visited {text-decoration:nonecolor:#344500}#m_blog div.cnt a:hover {border-bottom:1px #344500 dashedcolor:#344500}#m_blog {padding-left:15pxpadding-right:15pxmargin-top:20px}#m_blog div.tit{padding-top:0pxpadding-bottom:0pxcolor:#4E7304font-size:13pxfont-weight:boldtext-decoration:noneborder-bottom:1px solid #4E7304border-top:0px solid #ffffffTEXT-INDENT: 119pxline-height:17px}#m_blog div.tit a{color:#4E7304font-size:13pxfont-weight:boldtext-decoration:none}#m_blog div.tit a:visited{color:#4E7304text-decoration:none}#m_blog div.date{font-size:13pxmargin:-20px 0 8px 0color:#4E7304TEXT-INDENT: 7pxfont-weight:bold}#m_blog div.cnt{color:##005533line-height:20pxfont-size:15pxfont-weight:700PADDING-RIGHT: 10pxPADDING-LEFT: 10pxPADDING-TOP: 10pxPADDING-bottom: 10px}#m_blog div.more{margin:14px 0 16px 0text-decoration:nonefont-weight:bold}#m_blog div.more a{color:#fffffffont-size:14pxtext-decoration:nonefont-weight:bold}#m_blog div.more a:visited{color:#fffffftext-decoration:nonefont-weight:bold}#m_blog div.opt{color:#689411font-size:12px}#m_blog div.opt a{color:#689411font-size:12pxtext-decoration:none}#m_blog div.opt a:visited{color:#689411text-decoration:none}#m_blog div.line{margin-top:17pxline-height:17px}#m_blog div.none{padding:100px 0 100px 0color:#1a4a8afont-size:14px}#m_pro {text-align:leftpadding-left:18pxpadding-right:10px}#m_pro a{color:#995C00font-weight:boldtext-decoration:nonetext-align:center}#m_pro a:visited{color:#995C00font-weight:boldtext-decoration:none}#m_pro div.image{text-align:centerborder-bottom:#ffffff 1px solidpadding-top:5pxpadding-bottom:5px}#m_pro div.act{margin-top:10px}#m_pro div.user{color:#995C00font-size:12pxfont-weight:bold}#m_pro div.desc{color:#995C00font-size:12px}#m_pro div.line{margin-top:17pxline-height:17pxborder-top:1px solid #1A4A8A}#m_pro td{color:#995C00line-height:24pxfont-size:14px}#m_album div.image{text-align:centerpadding-top:30px}#m_album div.page{color:#995C00font-size:12pxtext-align:center}#m_album div.page a{color:#995C00font-size:12px}#m_album div.page a:visited{color:#330000}#m_links {padding-left:18pxpadding-right:18pxtext-align:leftborder-top:0px solid #995C00text-align:lift}#m_links div.item{color:# 6E981Afont-size:12pxLINE-HEIGHT: 21px}#m_links div.item a{color:#995C00font-size:12pxtext-decoration:none}#m_links div.item a:visited{color:#995C00}#m_links div.linediv.line{margin-top:5pxline-height:8pxborder-top:1px solid #D2E9F4}#m_artclg {border-top:0px solid #5C85BBpadding-top:5px}#m_artclg {padding-left:18pxpadding-right:18pxtext-align:leftborder-top:0px solid #995C00text-align:lift}#m_artclg div.item{color:#995C00font-size:12pxtext-align:leftpadding-left:0px}#m_artclg div.item a{color:#995C00font-size:12pxtext-decoration:none}#m_artclg div.item a:visited{color:#995C00text-decoration:none}#m_artclg div.linediv.line{margin-top:5pxline-height:8pxborder-top:1px solid #D2E9F4}#m_comment {padding-left:18pxpadding-right:18pxtext-align:leftborder-top:0px solid #995C00text-align:lift}#m_comment div.item{color:#D2E9F4font-size:12px}#m_comment div.item a{color:#995C00font-size:12px}#m_comment div.item a:visited{color:#995c00text-decoration:none}#m_comment div.item a.cnt{color:#995C00font-size:12px}#m_comment div.item a.cnt:visited{color:#995c00text-decoration:nonefont-weight:normaltext-align:center}#m_comment div.item a.cnt:hover{color:#D2E9F4text-decoration:underlinetext-align:left}#m_comment div.line{margin-top:5pxline-height:8pxborder-top:1px solid #D2E9F4}#m_albumlist div.note{color:#995C00font-size:14px}#m_albumlist div.desc{margin-bottom:12pxpadding:3px 10px 3px 10pxline-height:22pxbackground-color:#F2F2F2font-size:14px}#m_albumlist div.none{padding:100px 0 100px 0color:#995C00font-size:14px}#m_albumlist div.line{margin-top:10pxline-height:16pxborder-top:1px solid #ffffff}#m_albumlist div.tit{margin:6px 0 7px 0color:#995C00font-size:14px}#m_albumlist div.tit a{color:#995C00font-size:14px}#m_albumlist div.tit a:visited{color:#995C00}#m_albumlist span.count{color:#995C00font-size:12pxfont-weight:bold}#m_albumlist span.size{color:#999999font-size:12pxfont-family:Arial}#m_albumlist a.act{color:#995C00font-size:12px}#m_albumlist a.act:visited{color:#995C00}#m_albumlist a.page{color:#330000font-size:14px}#m_albumlist a.page:visited{color:#330000}#m_albumlist td.image{padding:5pxborder:1px solid #999999background:#995C00}#m_friend div.filter{margin-bottom:10pxpadding-left:10pxpadding-top:10pxheight:27pxline-height:27px}#m_friend div.catalog{margin-bottom:10pxpadding-left:10pxheight:27pxline-height:27pxbackground-color:#F2F2F2font-size:14px}#m_friend div.user{margin-top:4pxcolor:#995C00font-size:12px}#m_friend div.user a{color:#995C00font-size:12px}#m_friend div.user a:visited{color:#995C00}#m_friend div.line{margin-top:10pxline-height:16pxborder-top:1px solid #995C00}#m_mylink1 {padding-left:18pxpadding-right:18pxtext-align:leftborder-top:0px solid #995C00text-align:lift}#m_mylink1 div.item{color:#995C00font-size:12px}#m_mylink1 div.item a{color:#995C00font-size:12pxtext-decoration:none}#m_mylink1 div.item a:visited{color:#995C00}#m_mylink1 div.line{margin-top:5pxline-height:8pxborder-top:1px solid #D2E9F4}#m_mylink2 {padding-left:18pxpadding-right:18pxtext-align:leftborder-top:0px solid #995C00text-align:lift}#m_mylink2 div.item{color:#995C00font-size:12px}#m_mylink2 div.item a{color:#995C00font-size:12pxtext-decoration:none}#m_mylink2 div.item a:visited{color:#995C00}#m_mylink2 div.line{margin-top:5pxline-height:8pxborder-top:1px solid #D2E9F4}#m_mylink3 {padding-left:18pxpadding-right:18pxtext-align:leftborder-top:0px solid #995C00text-align:lift}#m_mylink3 div.item{color:#995C00font-size:12px}#m_mylink3 div.item a{color:#995C00font-size:12pxtext-decoration:none}#m_mylink3 div.item a:visited{color:#995C00}#m_mylink3 div.line{margin-top:5pxline-height:8pxborder-top:1px solid #D2E9F4}#m_mylink4 {padding-left:18pxpadding-right:18pxtext-align:leftborder-top:0px solid #995C00text-align:lift}#m_mylink4 div.item{color:#995C00font-size:12px}#m_mylink4 div.item a{color:#995C00font-size:12pxtext-decoration:none}#m_mylink4 div.item a:visited{color:#995C00}#m_mylink4 div.line{margin-top:5pxline-height:8pxborder-top:1px solid #D2E9F4}#m_filed {padding-left:18pxpadding-right:18pxtext-align:leftborder-top:0px solid #995C00text-align:lift}#m_filed div.item{color:#995C00font-size:12px}#m_filed div.item a{color:#995C00font-size:12px}#m_filed div.item a:visited{color:#995C00}#m_filed div.line{margin-top:5pxline-height:8pxborder-top:1px solid #D2E9F4}#m_setting a{color:#995C00}#m_setting a:visited{color:#995C00}#m_setting{line-height:22pxcolor:#995C00font-size:14px}#m_setting img.sel{border:4px solid #FFDB7B}#m_setting img.unsel{border:1px solid #D2D2D2}#m_setting span.tit{font-size:14px}#m_setting span.usr{color:#995C00}#m_setting div.sel{padding-top:6pxfont-size:14pxfont-weight:bold}#m_setting div.line{margin-top:20pxline-height:16pxborder-top:1px solid #ffffff}#m_sysinfo a{color:#995C00}#m_sysinfo a:visited{color:#995C00}#m_sysinfo{line-height:22pxcolor:#995C00font-size:14px}#m_sysinfo span.new{color:#FF0000font-size:10pxfont-family:Arial}#m_sysinfo span.date{color:#995C00font-size:14px}#m_setbase{color:#995C00font-size:14px}#m_setbase td{color:#995C00font-size:14px}#m_setbase div.line{margin-top:5pxline-height:8pxborder-top:1px solid #ffffff}{all rights reserved,http://hi.baidu.com/jsqk}#in_comment div.tit{margin-bottom:12pxcolor:#995C00font-size:14pxfont-weight:bold}#in_comment div.user{margin-bottom:6pxcolor:#995C00font-size:12px}#in_comment div.user a{color:#995C00font-size:12px}#in_comment div.user a:visited{color:#995C00}#in_comment div.user span.date{color:#995C00font-size:12px}#in_comment div.desc{color:#995C00font-size:12px}#in_comment div.line{margin-top:17pxline-height:17pxborder-top:1px solid #995C00}#in_send div.tit{margin:10px 0 10px 0color:#995C00font-size:14pxfont-weight:bold}/* 请不要随意修改版权，尊重别人的劳动成果.如有需要，请和浪儿本人联系 */
CSS是能实现的，不过有点麻烦。大概是这么实现：
在HTML中为需要“向右偏移15%+22px”的div加上两个辅助定位的div：
<div id="outer"><div id="theMiddel">
<div id="div"></div> <!-- 目的：此div向偏移15%+22px -->
</div>
</div>
2. 在CSS中，首先使最外层的<div id="outer">使用相对定位position:relative，占据15%的父元素的宽度(即width: 15%)，高度与目标<div id="div">一样；
3. 在CSS中，使以下两个div
<div id="theMiddel"><div id="div"></div> <!-- 目的：此div向偏移15%+22px -->
</div>
假设目标<div id="div">的宽度是50px。
<div id="theMiddel">使用绝对定位，定位到最上边最右边，这时候目标<div id="div">的位置就是：向右偏移15%减去目标<div id="div">的宽度（15% - 50xp）。
4. 目标<div id="div">使用绝对定位，然后right: -（50 + 22）px。这就是向右偏移15%+22px。
以下代码详细实现
向右偏移15%+22px.html 文件代码清单如下：
<!doctype html><html langj="zh">
<head>
<meta charset="utf-8">
<title>向右偏移15%+22px</title>
<link rel="stylesheet" href="marginRight.css">
</head>
<body>
<p>CSS绝对定位：向右偏移15%+22px</p>
<div id="outer">
<div id="theMiddel">
<div id="div"></div>
</div>
</div>
</body>
</html>
marginRight.css 文件代码清单如下：
#outer {position: relative
width: 15% /* 用宽度15%定位到15%位置 */
height: 50px /* 这行可以去掉，现在是为了看清偏移情况 */
background: rgb(220, 220, 220)/* 这行可以去掉，现在是为了看清偏移情况 */
}
#theMiddel { /* 中间部分使目标div移动到15%位置的最右边 */
position: absolute
top: 0
right: 0
}
#div {
position: absolute
right: -72px
/* 偏移量是：目标div的宽度加上22px。如果目标div宽度变化，这行自己相应变化 */
width: 50px
/* 目标div的宽度，自己设定，如果变化，上一行的负偏移量也要改变 */
height: 50px
background: rgb(18, 48, 168)
}
