如何使用纯CSS3来生成家谱

html-css019

如何使用纯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.

欧式家谱体例,是现在用得最多的家谱模式。它是北宋大文学家欧阳修家族家谱模式的简称。它的特点就是:世代分格,由右向左五世一表,一表一提。上下为父子,左右为兄弟。1、 欧式家谱一般是一页左右十竖行,上下五层横格。上下为父子,左右为兄弟。2、上下五层横格,为五世。从上往下数,一、二、三、四、五,五世。每上下相邻的两层均为父子关系。

3、同一层横格中左右相排的人均为同辈的兄弟。以年齿论,右边的排行为长,向左依次递减为老二、老三、……。4、父亲只有一子,则竖行中父子名讳上下相对如果父有三子,正对父亲名下的是长子,紧邻长子左边的两格则填写老二老三的名讳。5、同辈的人数较多,一页填写不完可往下页延续,但表示世系辈份的横格不能舛错,不然的话,世系辈就乱了。6、一个竖格,填写夫妇二人名讳,右边写男人名讳,左边写妻子名讳。需要加注的,名字旁边加注小字。7、首页五世,这五世不论占了几页,都是同表,都得一提。提,就是把本表最下一横层

中,第五世的所有名字,都提到下一表中最上层的第一层横格中,按原来的顺序从右到左依次排好。提的作用就是上下两表关系的承上启下,互相衔接,不致舛错、断裂。8、提到第二表的五世,领续下面的六、七、八、九四世。由于此表领续的五世是上表未世的重复,所以此表实际上只续了四世。下边后续的各表都是如此,这叫"五世一提,实续四世"。9、家族较大,

支系众多,可续完一支,再续另外一支,在卷首编好目录页码,便于日后的查阅。10、以上9项,都是世系排序的元素。世系是家谱的主要内容,除世系外,还有凡例、序言、影像、家规、题名、耆寿、节烈等诸多项目。由于各个家族具体情况不同,所以家谱编写的内容也不尽相同。

族脉家谱是一个免费的个人单机版家谱编纂软件。它继承了“族脉网”原有网络版上的主要服务功能,同时充分利用了个人电脑上的各项特有功能,实现了为用户提供了一个兼而有之、取长补短的第二服务平台。

这款族脉网的用户端软件是利用近几年来最新个人电脑上的软件技术制作的。它无论在数据的存储、处理、以及用户编纂家谱的流程上都做了精心细致的设计。与网络版服务相比,“族脉家谱”单机版软件的长处是反应速度能大大提高了许多,这样在编纂家谱时的用户体验便得到明显改善。

结合“族脉网”的网络服务,我们的用户可以实现所有家谱编纂的功能需求,如无限排版打印、支持多种日历输入、发表抒怀、撰写文选、与亲友交流和设立纪念馆,等等。

族脉家谱依托的族脉网是一个最俱权威性、集全面数字化编辑功能、和提供家谱、家书、家史、家庭档案、以及缅怀纪念馆的服务网站。“族脉网”为人们在网络世界里提供了一个以家族血脉为线索,积淀历史、缅怀纪念先人、寄托和凝聚情感、激励和启发后人的开放平台。与其它家谱软件或网站相比,“族脉网”提供了一个真正数字化的网络、和单机的双平台环境。

此外,它的服务不提供影印家谱、不灌水、也不暗插木马、更一改纯单机版软件那种“独唱独秀”而无法调动其余成员参与建谱的局面。通过网络和单机这两个平台的有机互动和联系,“族脉网”网络和其“族脉家谱”的服务囊括了世系图谱的编辑,成员、配偶和好友内容的编辑,家谱打印,数据备份、导入,家谱树图的拷贝和粘贴,家谱继承权的移交,隐私保护,乃至家谱与家谱之间相互关联而方便浏览的“亲友链接”,缅怀纪念馆等多项功能。与国外的软件或服务相比,“族脉网”充分考虑了中国家谱对“字辈派语”、“谱牒堂号”、子女排行和成册排序区别、始祖基准动态定位、以及阴阳历日期输入等特别需求。

在打印功能上,“族脉网”还特别解决了对无限量配偶、子女成员的排版打印的经典难题,以及家庭成员之间的“跳转链接”、“世代标注”、以及“辈份优先,家庭一体;成册第一,排行第二”等问题。

族脉家谱的主要功能如下:

1. 家谱数据录入:如家谱的先公略史、堂号、字辈派语、设定开放状态以保证网络的浏览安全性。

2. 成员数据录入:如成员的名字、世号、字辈、成员图片、配偶以及好友信息和图片、成员的重大事记。

3. 家谱操作功能:包括编辑、删除、添加,拷贝及粘贴功能。

4. 搜索排序成员功能:输入家谱成员的关键词查找你需要的成员,以及整理显示和家庭立的排行次序。

5. 统计功能:软件中会自动统计家谱总人数、总辈份、性别、在世人数以及辞世人数。

6. 名人集锦:可以突出家谱成员中有重大地位的成员。

7. 打印功能:将族脉家谱中的数据备份上传到族脉网中可以实现家谱的无限排版打印,如电子书和壁挂图两个格式。

http://www.crsky.com/soft/31713.html您可以下载本软件后打开帮助项,里面有软件的使用说明。