白白白兔子吧 关注:482贴子:45,618

╄冲啊冲啊┮安哥拉┮HOHO╅^-^艾丽的空间模版教程~~HOHO~

只看楼主收藏回复

那个……= =
话说这教程不知道要弄到什么时候~
希望能做好……^-^b


IP属地:上海1楼2007-08-13 18:17回复
    那么……初学者应该知道很重要的一点= =
    那就是
    怎样创建新模板来编辑~~
    要创建新模板~步骤是
    设置-模板设置-创建新模板

    PS我是艾丽= =在用MJ


    2楼2007-08-13 18:26
    回复
      初级部分;


      创建了新模板后~
      会看到
      body{background-color:#FFFFFF}
      这样的一排~
      这是空间的主背景
      如果要选用图片的话
      就将其改成
      body{background:url() repeat #FFFFFF}括号里加上要用的图片地址

      在这里~
      repeat表示图片平铺~
      也可以按图片大小更换成
      no-repeat或repeat-x或repeat-y(分别代表不平铺、平铺一排和靠左)


      3楼2007-08-13 18:33
      回复
        希望 我能看得懂....


        4楼2007-08-13 18:39
        回复
          @_@ 看不


          6楼2007-08-13 18:57
          回复
            加油= =
            P.S......我尽量不砍楼....


            IP属地:天津8楼2007-08-13 19:06
            回复
              接下来就是空间顶部的图了


              #header{height:89px;background:#3399CC}
              #header div.lc{background:url(http://img.baidu.com/hi/temp1/hdl.jpg) no-repeat}
              #header div.rc{background:url(http://img.baidu.com/hi/temp1/hdr.jpg) no-repeat top right}

              首先需要去掉第一排的background:#3399CC
              这样就可以透明
              接着用自己喜欢的图片(也可以不要)取代http://img.baidu.com/hi/temp1/hdl.jpg

              下面是去掉background:#3399CC和http://img.baidu.com/hi/temp1/hdl.jpg
              的效果


              9楼2007-08-14 13:01
              回复
                #header{height:89px;} 
                可以修改px前数字的大小来决定图片露出部分的多少

                200px和400px的不同效


                10楼2007-08-14 13:09
                回复
                  懂了


                  11楼2007-08-14 13:10
                  回复


                    12楼2007-08-14 13:15
                    回复
                      接下来的3排都是空间标题的代码;

                      #header div.tit{top:8px;left:20px;line-height:22px;font-size:20px;font-family:黑体}
                      #header div.tit a.titlink{color:#FFFFFF;text-decoration:none}
                      #header div.tit a.titlink:visited{color:#FFFFFF;text-decoration:none}

                      top代表和页面顶部的距离
                      left是跟左面的距离
                      font-size是大小
                      font-family是字体类型
                      可以调整它们的后面的数字大小来调整标题
                      下面的两排主要是决定颜色
                      换颜色时取同一种颜色替换那两排的#FFFFFF

                      以下是颜色为灰色的代码
                      #header div.tit{top:8px;left:20px;line-height:22px;font-size:20px;font-family:黑体}
                      #header div.tit a.titlink{color:#BBBBBB;text-decoration:none}
                      #header div.tit a.titlink:visited{color:#BBBBBB;text-decoration:none}


                      13楼2007-08-14 13:33
                      回复
                        #tabline{top:89px;background-color:#FFFFFF}
                        这是一根线~
                        一般来说直接删掉#FFFFFF就可以了


                        14楼2007-08-14 13:35
                        回复
                          #tab{top:67px;background:url(http://img.baidu.com/hi/temp1/tabbg.gif) repeat-x}
                          这是TAB栏(如左图)
                          去掉http://img.baidu.com/hi/temp1/tabbg.gif后可变为透明(如右图


                          15楼2007-08-14 13:41
                          回复
                            话说下面这排是在空间标题代码下面的……
                            刚才漏说了= =


                            #header div.desc{top:33px;left:20px;color:#FFFFFF;font-size:13px}
                            这是空间简介的代码
                            top、left和font-size的意思和13楼一样
                            color代表颜色
                            更改后面的#FFFFFF可以改变颜色
                            红色简介的代码
                            #header div.desc{top:33px;left:20px;color:#FF335C;font-size:13px}


                            16楼2007-08-14 13:54
                            回复
                              #tab a.on,#tab a.on:link,#tab a.on:visited{margin-top:3px;border-left:1px solid #FFFFFF;border-right:1px solid #FFFFFF;border-top:1px solid #FFFFFF;line-height:19px;background-color:#F3F1F1;color:#197CAE;font-size:14px}
                              这几排没有什么太大的东西~
                              重点在于最后的background-color:#F3F1F1;color:#197CAE
                              前面一个代表TAB被选中时的背景(如左图灰色部分)
                              后面一个代表TAB被选中时的字体颜色(如左图蓝色部分)
                              这是TAB选中背景为红,字体颜色为灰的代码(见右图)
                              #tab a.on,#tab a.on:link,#tab a.on:visited{margin-top:3px;border-left:1px solid #FFFFFF;border-right:1px solid #FFFFFF;border-top:1px solid #FFFFFF;line-height:19px;background-color:#FF335C;color:#BBBBBB;font-size:14px}


                              17楼2007-08-14 14:01
                              回复