如何使用纯CSS3来生成家谱

html-css017

如何使用纯CSS3来生成家谱,第1张

/*Now the CSS*/

* {margin: 0padding: 0}

.tree ul {

padding-top: 20pxposition: relative

transition: all 0.5s

-webkit-transition: all 0.5s

-moz-transition: all 0.5s

}

.tree li {

float: lefttext-align: center

list-style-type: none

position: relative

padding: 20px 5px 0 5px

transition: all 0.5s

-webkit-transition: all 0.5s

-moz-transition: all 0.5s

}

/*We will use ::before and ::after to draw the connectors*/

.tree li::before, .tree li::after{

content: ''

position: absolutetop: 0right: 50%

border-top: 1px solid #ccc

width: 50%height: 20px

}

.tree li::after{

right: autoleft: 50%

border-left: 1px solid #ccc

}

/*We need to remove left-right connectors from elements without

any siblings*/

.tree li:only-child::after, .tree li:only-child::before {

display: none

}

/*Remove space from the top of single children*/

.tree li:only-child{ padding-top: 0}

/*Remove left connector from first child and

right connector from last child*/

.tree li:first-child::before, .tree li:last-child::after{

border: 0 none

}

/*Adding back the vertical connector to the last nodes*/

.tree li:last-child::before{

border-right: 1px solid #ccc

border-radius: 0 5px 0 0

-webkit-border-radius: 0 5px 0 0

-moz-border-radius: 0 5px 0 0

}

.tree li:first-child::after{

border-radius: 5px 0 0 0

-webkit-border-radius: 5px 0 0 0

-moz-border-radius: 5px 0 0 0

}

/*Time to add downward connectors from parents*/

.tree ul ul::before{

content: ''

position: absolutetop: 0left: 50%

border-left: 1px solid #ccc

width: 0height: 20px

}

.tree li a{

border: 1px solid #ccc

padding: 5px 10px

text-decoration: none

color: #666

font-family: arial, verdana, tahoma

font-size: 11px

display: inline-block

border-radius: 5px

-webkit-border-radius: 5px

-moz-border-radius: 5px

transition: all 0.5s

-webkit-transition: all 0.5s

-moz-transition: all 0.5s

}

/*Time for some hover effects*/

/*We will apply the hover effect the the lineage of the element also*/

.tree li a:hover, .tree li a:hover+ul li a {

background: #c8e4f8color: #000border: 1px solid #94a0b4

}

/*Connector styles on hover*/

.tree li a:hover+ul li::after,

.tree li a:hover+ul li::before,

.tree li a:hover+ul::before,

.tree li a:hover+ul ul::before{

border-color: #94a0b4

}

/*Thats all. I hope you enjoyed it.

九澧《关氏宗谱》实乃荆州关氏宗谱也。荆州之有关氏,要从关公算起。关公长期驻守荆州,与其子关平一起遇难之后,关平之子,关公之孙关樾因其祖、父均葬于荆州之当阳,故特地留下守坟而没有回山西解州老家。关樾40代孙关琪生四子:长子关鸾、次子关福住荆州当阳,三子关德住江陵龙湾,四子关质住潜江。关质七代孙关珏生三子:长子关文汉留潜江,次子关文亨,三子关文珠迁湖南澧县。三国时,荆州辖南阳、南郡、江夏、零陵、桂阳、武陵、长沙八郡、相当于今天之湖北、湖南全省和河南、贵州两省的一部分地区。后来荆州成为府和郡。总之,当阳、江陵、潜江都是荆州所辖之地。故其始祖文亨、文珠均是荆州人。修关氏族谱者也都众口一词:澧之关氏来自荆州。《关氏创修家乘源流序》云:“缅我支始祖文珠、文亨二公,汉少将军平公四十八世孙也。明末同由荆州来澧落叶。”《关氏迁澧及创修族谱源流序》云:“平公支下四十八世孙文珠、文亨两公由荆州来澧”。再从时间来看,从三国至民国修谱其间1700年,关樾后人一直住荆州而文珠、文亨从荆州迁澧不过300多年。以代而论,从关公至文珠,文亨计48代,而从文珠、文亨迁澧不过八九代而已。总而言之,九澧之关氏始祖都是荆州人。从所创修之《关氏宗谱》看,从始祖文珠、文亨起,前面48代的内容都是照抄道光九年关楚先所携至澧之荆谱,简言之现存第二卷全部和第三卷之《汉夫子以下实录》均系照抄于荆谱。而上述这些内容又是谱的关键部分。没有这些内容就称不上谱。九澧之关氏明末至清道光,历时近300年,其所以不敢造谱,就是因为他们那时一直都不知道这些内容。这就是笔者以为九澧之关氏族谱实乃荆州关氏族谱的原因。换句话说,我们虽然至今未发现荆州关氏族谱,但见了九澧关氏族谱之后,也就等于看到荆州关氏族谱了,大可不必以没有发现荆州关氏族谱为憾。从研究关公文化的角度讲,更应作如是观。因为研究荆州关氏族谱的关键资料都巳全部抄录在九澧关氏族谱中了。

九澧关氏族谱的出现,使我们知道了关氏族谱不只荆襄,解州、洛阳、九澧四部。因为从谱中记载看,关兴十五世孙关播从西蜀迁江西,关播十七世孙又从江西迁湖南余市(石乔),他们有道光六年所修老谱,又有所谓新谱,谱载鸣、鸠,鹤三公是佘市(石乔)始祖。关正瑞虽然极力说关兴后裔之新老谱自相矛盾,但关兴后裔有谱总归是事实。这就是说,关氏族谱不只四部,似也不能就此断定只有五部。

此外,关氏族谱还有许多珍贵的资料,现略作介绍:

1,江陵即今荆州城,公所筑也。晋桓温流增饰。(笔者按:据现在考古发现,荆州城确为关公所筑)。

2、荆州府有公书四大字匾:三秦雄镇。题曰郡主关某书。万历初,有闽人知府事,易去其匾,地震三日,和郡骇异,于是百姓白诸守,仍悬之乃止。

3、人们但知关公有画风竹诗:“不谢东君意,丹青独立名。莫嫌孤叶冷,终久不凋零”,而不知还有画雨竹诗:“炎精嘘不然,鼎足势如许。英雄泪难禁,点点枝头雨。”(徐州志石刻,在铁佛寺。)

4、人们但知关公有洛阳关林,当阳关陵,而不知还有华阳墓。明一统志:公墓在四川成都府城外万里桥南。公既殁于吴,昭烈招其魂葬于此(见《四川总志》)。

5、谱载京谱派次:

开先锡肇 启序成章 洪叶可茂 敦伦履常

培修衍庆 志裕振祥 承绪惟正 延生致康

锦堂彦义 瑞献嘉邦 崇本向道 卜年永昌

圣组五十四代当阳守陵承袭翰林院五经博士裔天楫咨部谨取。

6、人们但知当阳关陵,洛阳关林均增设五经博士奉祀陵墓,世袭其职,而不知“在荆州城建庙,称为帅府奉祀生”,且还有监察之权。更不知关氏后裔可优免一切杂役。

7、关氏族谱中还有关公遗迹及其对联和关公传说,不少至今未见提及者。

可惜的是缺了第三卷,无从得见《汉夫子以下实录》,即从关公至第48代孙文珠、文亨的世表。关正瑞《澧阳关氏来源》言:

圣祖五十六代裔楚先等携谱来宅,展阅之,始知四十八世祖文珠公由荆潜迁居于澧州梦溪寺,上溯至圣祖,世系朗朗,凛然如在坐列。

据此可知荆谱从关公至文珠48代世系是非常清楚的。再看《墨谱告竣序》:“相传有族祖正瑞公抄录京谱之旧稿尚存,展阅细卷,乃抄文珠公以上四十八代之昭穆”。说明荆谱所载关公至文珠这48代的确很详细,昭穆未混,与关正瑞所言之“世系朗朗,凛然如在坐列”完全一致。不见第三卷,实乃一大憾事!还有一点要指出的是:谱中“圣祖灵应事迹”“服制图”、“家法”等内容,愚以为应予扬弃者不少。

如何建设成功的个人网站

一、要明确建网站的目的

二、给网站取一个好听的名字

三、注意网站总体规划

四、注意头版头条的设置

五、时常对网站进行更新维护

六、利用音乐、特效、图片等装点网页

七、熟悉了解自助建站手册

八、个人网站栏目设置参考

【 要明确建网站的目的 】

在网站建设之前,首先要明确自己的建站目的,有很多人就是因为没有目的,提交了申请之后却不知道该放些什么。个人主页其实在一个人的生活中可以起到非常重要的作用。有了个人主页就像是在喧嚣的城市终于有了属于自己的小屋,屋子里该做什么 样的装饰,各个房间用来作什么,要结交什么样的朋友,甚至想做什么样的买卖都可以由你决定。但是 有一点可以肯定,来拜访你的人性格各异,要想对每个人都投其所好是不可能的。对个人主页来说,一个人的精力有限,不可能把自己的网站做的像某些门户网站那样什么都有。有些人就胡乱的在自己的网站上堆放一些从其它网站上拾来的破烂,除了让访问者敬而远之之外,顶多再背上一个垃圾站的“雅号”。不论你的爱好是什么,个人网站一定要有个性,突出自己的特点,对于你感兴趣和熟悉的东西,你可以不费力气地建立起一个非常好的站点。比如你喜欢听音乐,那你可以搜集一些和音乐有关的东西,例如:歌手资料、好歌推荐、娱乐新闻等等。甚至可以开通留言板,使对音乐感兴趣的访问者来到你这里。让访问者如同来到了一个俱乐部或者是图书馆,查找资料,音乐试听,讨论心得… 这样别人会认为他找到了一个对他来说非常有价值的网站,他不再需要到茫茫的网海中到处去寻觅了,在你这里不但能找到所需要的一切,而且还能通过留言板使自己结交同好,甚至还能在“圈子里”赢得一点小小的名声,那他就会成为网站的常客,甚至还会主动帮你宣传,而你自己也通过这个网站对你所喜欢的东西有了更深刻的研究,同时也认识了很多志同道合的朋友,这难道还不算成功吗?所以,在网站制作之初,确定自己建网站的目的是非常很需要的! 回顶部

【 给网站取一个好听的名字 】

在你决定了网站的内容之后,首先要做的就是要给你的网站取一个响亮而又能直接反映网站内容的名字,这很重要。互连网上的网站浩如烟海,同类的网站一定会有很多。没有一个好名字,就像是不会吆喝的小贩,生意很难兴旺。有的站长喜欢取一些个性化的而且气势磅礴的名字,实际上是华而不实,极有可能会让看到网站名字的人一头雾水,有那么多内容相近的网站,谁会有那个好奇心呢?

【 给注意网站总体规划 】

有了一个合适的名字,接下来就要决定如何设计你的网站。要有条理,每个栏目内容各有特色,不能一锅粥。另外,现在有很多人的网站上一厢情愿地放上了其他网站或栏目的链接作为自己网站的内容。这种“为他人做嫁衣”的方法不可取。这种做法会让访问者产生网站本身空洞无物的感觉,尤其是加上著名网站的链接,这样做对自己的网站没有任何意义。如果想为访问者提供互联网上的资源信息,你可以把这些链接集中放到某一个栏目当中。个人网站的目的无非就是交朋识友,宣传自己。所以内容要有个性。写网络日记是一个很不错的想法。一方面让朋友们了解你的动态,使你的网站更有人情味,另一方面也是你的人生历程的一个记录。

【 注意头版头条的设置 】

建设网站特别需要注意的是对头版头条的利用,头版头条非常有用,现在已经逐渐引起了更多人的注意 。对于非常重要的信息,或者你的得意之作,把它们列在头版头条,访问者只要打开主页就可以见到主要内容,这就增加了访问者阅读该信息的机会,现在已经逐渐引起了更多人的注意。对于非常重要的信息,如个人作品、个人简历等等,把它们列在头版头条,访问者只要打开主页就可以见到主要内容,这就增加了访问者阅读该信息的机会。

【 时常对网站进行更新维护 】

网站的维护也很重要。到过散发着霉味的仓库吗?我想是没有人愿意到那里做客的。自己的小屋要及时打扫,人气才会旺盛。好久没有更新的网站会渐渐失掉人气的。内容要时时更新,或一二日,或三五日 ,但是千万不能一个礼拜也不去。另外,要经常光顾自己的论坛和留言板,清除不好的内容。请了一屋子客人,主人却溜出去了,实在是有点不好交代吧。

【 利用音乐、特效、图片等装点网页 】

很好的利用我们提供给你的背景音乐、网页特效、图片上传等功能,可以为你的站点带来非同一般的效果,它们可以你的网站更生动、更个性。但也不要随便使用这些功能,烂用它们不但不会美化你的网页,反会会而显的不伦不类!注意要结合自己网站的特点、风格以及定位来选择使用!

【 熟悉了解自助建站手册 】

网站建设之前,请先看一下我们提供给你的建站手册,里面包含网站建设所有的步聚和问题解答,俗话说:磨刀不费砍柴工,看了我们的建站手册之后,相信会对你在网站建设的过程起到事半功倍的效果! 回顶部

【 个人网站栏目设置参考 】(哪些栏目或文章不便给公众看的请自行设置权限)

工作简介

工作动态

工作笔记

读书笔记

工作联系

客户档案

资料收集

著书创作

展览撰文

工作简历

在线交流

旅行世界

家庭相册

成果成就

成长健康

建议您将“成长健康”在各位家庭成员下,再设“成长档案”和“健康档案”两个“小栏目”;

“成长档案”的内容,主要是为婴幼儿建立的。如出生时的重量、身高、照片等。以后每月的重量、身高、照片,什么时候会座、会趴、会站、会走、会叫爸爸妈妈、会识字、会唱歌,或有其它天才的表现等等,都是很宝贵的资料,一直可持续做到成年。

“健康档案”的内容,最好从婴幼时建立。包括先天有什么患过什么疾病,什么时候在哪家医院、哪个医生、什么治疗手段、什么药物治的等等,最好是原始病历都能扫描存档。

对有些“老毛病”要做跟踪记录,如发病的时间、症状、当时的环境,通过什么治疗手段等等,这些资料是很宝贵的,通过资料积累,就比较容易发现发病的原因。许多资料是要经过十几年,甚至几十年才会体现其重要性。

教育档案: 十几年的学生年代,资料是极其丰富的。但能完整地保留下这些资料,却为数不多,想追朔学生生涯,更多的是惋惜。毕竟传统收藏资料的手段太落后。

学龄前:幼儿园、教师、同学、照片、成绩、获奖等。

小学阶段:学校、各科教师、同学录、照片、各年各科成绩、获奖、作文、日记等;

初中阶段:学校、教师、同学、照片、各年各科成绩、获奖、作文、日记等;

高中(或中专、技校)阶段:学校、教师、同学、照片、各年各科成绩、获奖、作文、日记等;

大学阶段:学校、教师、同学、照片、各年各科成绩、获奖、论文等;

业余学业:学校、教师、同学、照片、成绩、获奖等

亲属交流

老家老照

家庭大事

旅游专辑 记载旅游行迹。包括同行人员、日期、行走路线、交通工具及价格、下榻宾馆及价格、旅游点及门票价格、照片、感受及记事等等。

婚恋专辑 记载自己的婚恋史。如相识经过、介绍人、恋爱日程、情书、情物、婚礼、结婚纪念及相关照片等等。

投资理财 记载家庭资产的明细表。如收益、支出、投资、财产、负债、债权等

个人简历

家史家谱: 这是个非常有意义的栏目。

提示:

1、如果家史家谱内容庞大,建议另单独申请一个网上家园来做。

2、该栏目设置“大类”为宜。

3、按家谱的树结构对该栏目进行分类。所有家族成员的目录均设为“小类”,留有余地。

4、如果夫妻男方为陈氏,女方为刘氏,“家史家谱”栏的下一级首先得并列分为“陈氏家谱”和“刘氏家谱”两个“大分类”,然后再按各自的姓氏做下去。

5、以陈氏家族为例,下一级并列栏目有:陈氏渊源、陈氏家谱及其它与陈氏家谱有关的综合资料。其中“陈氏家谱”下,并列的目录有:陈氏家谱表、祖辈(从有资料记载的开始设为其设“小类”)。

6、目录设置到父辈兄妹分支时,如果条件允许,可以将父辈各兄妹栏目的维护管理权分给父辈兄妹或其子女。这样,整个家谱的内容就可以做得非常充实、准确和明晰。

保险档案: 即家庭各种保险的档案资料。如保险的种类、保险公司、有效日期、权益、联系人、联系电话等。

生活窍门: 即衣食住行的诀巧。

家庭装修

应急处理

琐事备忘