谁会用樱花编辑器做个人网页?

html-css08

谁会用樱花编辑器做个人网页?,第1张

Sakura Editor (樱花编辑器)是一个日本人开发的 Windows 下的文本编辑器。

这和Notepad,EditPlus类似,用这样的编辑器做个人网页,需要对html代码比较熟悉,完全可以在编辑器下面写一个个人网页的。所有代码纯手工。

初学者还是建议用网页三剑客的Dreamweaver来制作网页,它在代码模式和可视化模式下都可以编辑网页。当然,单纯靠网页编辑器做一个个人主页是不够的,你还得会设计啊,会用PS或FW设计网页,然后切片,在DW中制作成HTML页面,如果要页面丰富,最好会一点FLash更好啦!

祝学习进步,愿你在学习过程中获得快乐和成就感!

百度空间CSS表较详细注释:

作出解释的都是主页的相关代码,其他页面的没有测试。希望能给刚接触空间的朋友一些帮助^_^

关于其他空间中原来没有的美化代码请参见我的其他日志:

http://hi.baidu.com/tblc

打开CSS表:

在空间页面上依次点击:设置——高级设置——自定义css

代码解释:

1、关于文字或背景的颜色的16进制代码形式如:#530C0E

可以到如下网页直观查看颜色代码:

http://shirley329.blogchina.com/3501281.html

也可以用颜色的相应英文单词替换,如:Black Fuchsia Gray Gree Lime Maroon Navy Olive Purple

Red Silver Teal White Yellow Blue Aqua

2、相关元素“位置”为“center,left,right”,可直接相互替换;

3、文字等元素的大小格式为“13px”数字越大字号或元素就越大,反之则越小;

4、图片地址可直接用可以引用的地址替换,建议将图片传到空间相册后再引用。

5、代码详细注释:

body{background-color:#530C0E}

——背景颜色

#header{height:89pxbackground:url() no-repeat}

#header div.rc{background:url() repeat-x}

——页面上方“主页博客|相册……”栏背景图片

#tab a.on,#tab a.on:link,#tab a.on:visited{margin-top:3pxline-height:19pxbackground-

color:#BC0304color:#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:#DAE9F5}

#tab2 span{color:#000000font-size:12pxfont-weight:bold}

#tab2 a{font-size:12px}

#tab2 a:link{color:#0000CC}

#tab2 a:visited{color:#0000CC}

.stage{background:url() no-repeat top leftline-

height:1px}

——每个栏目右上角远郊边沿图片

.modbl{background-color:#FFF6E7border-left:1px solid #FFF6E7border-bottom:1px solid

#FFF6E7line-height:1px}

——每个栏目左下角点的设置

.modbc{background-color:#FFF6E7border-bottom:1px solid #FFF6E7line-height:1px}

——每个栏目最下端一条的设置

.modbr{background-color:#FFF6E7border-right:1px solid #FFF6E7border-bottom:1px solid

#FFF6E7line-height:1px}

——每个栏目右下角点的设置

#m_blog div.tit{font-size:14pxfont-weight:bold}

#m_blog div.tit a{color:#000000font-size:14pxfont-weight:bold}

——日志标题大小颜色,未被点击

#m_blog div.tit a:visited{color:#000000}

——日志标题大小颜色,已被点击

#m_blog div.date{margin:5px 0 8px 0color:#666666}

——日志日期文字大小颜色

#m_blog div.cnt{color:#000000line-height:20pxfont-size:14px}

——日志内容大小颜色

#m_blog div.more{margin:14px 0 16px 0}

#m_blog div.more a{color:#D77B18font-size:14px}

——日志“阅读全文>>”的大小颜色,未被点击

#m_blog div.more a:visited{color:#D77B18}

——日志“阅读全文>>”的大小颜色,已被点击

#m_blog div.opt{color:#666666font-size:12px}

——“类别:技术专区 | 编辑……”中的“|”的颜色大小

#m_blog div.opt a{color:#D77B18font-size:12px}

——“类别:技术专区”的大小颜色

#m_blog div.opt a:visited{color:#D77B18}

——“编辑 删除 评论(4) 浏览(21)”的大小颜色

#m_blog div.line{margin-top:17pxline-height:17pxborder-top:1px solid #F4C1B5}

——日之间的分割线的相关设置

#m_blog div.none{padding:100px 0 100px 0color:#000000font-size:14px}

——隐形设置,不需要改变

#m_pro a{color:#D77B18}

——个人档案中“查看详细信息”的颜色,未被点击

#m_pro a:visited{color:#D77B18}

——个人档案中“查看详细信息”的颜色,已被点击

#m_pro div.image{text-align:center}

——个人档案中照片的显示位置,分为“中,左,右——center,left,right”

#m_pro div.act{margin-top:10px}

——个人介绍和照片的间距

#m_pro div.user{margin-top:10pxcolor:#000000font-size:12pxfont-weight:bold}

——个人用户名的大小颜色

#m_pro div.desc{color:#000000font-size:12px}

——个人介绍的大小颜色

#m_pro div.line{margin-top:17pxline-height:17pxborder-top:1px solid #F4C1B5}

#m_pro td{color:#000000line-height:24pxfont-size:14px}

#m_album div.image{text-align:center}

——相册中照片的显示位置,分为“中,左,右——center,left,right”

#m_album div.page{color:#666666font-size:12pxtext-align:center}

#m_album div.page a{color:#0000CCfont-size:12px}

#m_album div.page a:visited{color:#0000CC}

#m_links div.item{color:#000000font-size:12px}

——友情链接的连接描述的大小颜色

#m_links div.item a{color:#D77B18font-size:12pxtext-decoration:none}

——友情链接名的大小颜色,未被点击

#m_links div.item a:visited{color:#D77B18}

——友情链接名的大小颜色,已被点击

#m_links div.line{margin-top:5pxline-height:8pxborder-top:1px solid #F4C1B5}

——友情链接见的分隔符的相关设置

#m_artclg div.item{color:#666666font-size:12px}

——文章分类中各分类后面主题数及括号的大小颜色

#m_artclg div.item a{color:#D77B18font-size:12px}

——文章分类中各分类的大小颜色,未被点击

#m_artclg div.item a:visited{color:#D77B18}

——文章分类中各分类的大小颜色,已被点击

#m_artclg div.line{margin-top:5pxline-height:8pxborder-top:1px solid #F4C1B5}

——文章分类中各分类之间的分割线的相关设置

#m_comment div.item{color:#000000font-size:12px}

#m_comment div.item a{color:#D77B18font-size:12px}

——最新评论中用户名的大小颜色,未被点击

#m_comment div.item a:visited{color:#D77B18}

——最新评论中用户名的大小颜色,已被点击

#m_comment div.item a.cnt{color:#000000font-size:12pxtext-decoration:none}

——最新评论中评论文字的大小颜色,未被点击

#m_comment div.item a.cnt:visited{color:#000000text-decoration:none}

——最新评论中评论文字的大小颜色,已被点击

#m_comment div.item a.cnt:hover{color:#000000text-decoration:underline}

————最新评论中评论文字当鼠标移上去时的颜色

#m_comment div.line{margin-top:5pxline-height:8pxborder-top:1px solid #F4C1B5}

——最新评论中各评论之间的分割线的相关设置

有什么不懂的去我空间留言 http://hi.baidu.com/fayewang8