梦江南 发表于 2025-10-27 15:38

重阳节习俗和来历(学习黑黑老师的tzMaker发文章再演示)

本帖最后由 梦江南 于 2025-10-27 18:08 编辑 <br /><br /><style>
        @import 'https://638183.freep.cn/638183/web/tz/tz.css?v1';
        .wz {
                color: navy;
                background: url('https://638183.freep.cn/638183/small/webp/bg01.webp') no-repeat 0 0/100% 100%;
        }
.wzh2 { font-size: 30px; }
      .wz p:not(.tMid):not(.tRight) { text-indent: 2em; }
        .wz p.tMid, .wz p.tRight, .wz p.gMid {
    text-indent: 0em;
}
        #player { height: 80px; }
        #progress { height: 40px; }
</style>

<div id='wz' class="wz"></div>

<script type="module">
        import TZ from 'https://638183.freep.cn/638183/web/tz/tz.min.js';
        const tz = TZ.TZ(wz);

        const text = `
<h2 class="tMid">重阳节的习俗和来历</h2>
<p class="tMid">文字来于网络</p>
<p class="tMid"><img width="450" src="https://s21.ax1x.com/2025/10/27/pVxpqS0.jpg" alt="" /></p>
<p>1.登高:重阳节最重要的习俗之一,人们会登高望远,寓意避灾祈福、强身健体。登高地点包括高山、高塔、城楼等,金秋时节登高可心旷神怡、健身祛病。</p>
<p>2.佩茱萸:茱萸香味浓,有驱虫去湿、逐风邪等作用,古人认为佩戴茱萸可辟邪求吉。人们会将茱萸插在头上、佩戴于臂或制成香袋随身携带。</p>
<p>3.赏菊与饮菊花酒:菊花是重阳节的象征花卉,赏菊、咏菊是文人墨客修身养性的活动。同时,菊花酒被视为“吉祥酒”,有祛灾祈福之意,由含苞待放的菊花与黍米浸曲酿制而成。</p>
<p>4.吃重阳糕:又称花糕、菊糕、五色糕,是重阳节的传统食品。重阳糕制作多样,有的做成九层宝塔形状,寓意步步登高,部分地区还会在糕上插小红纸旗或点蜡烛,以替代“登高”之意</p>
<p>5.祭祖:重阳节是中国传统四大祭祖节日之一,人们会在这一天祭扫祖坟、缅怀先人,表达对祖先的感恩与追思</p>
<p>6.敬老:因“九”与“久”同音,有长久长寿之意,1989年中国将重阳节定为“老人节”,2012年《老年人权益保障法》明确其为老年节,敬老、爱老、助老成为节日重要主题。</p>
<p>7.晒秋:在南方山区村落,人们会在房前屋后、窗台屋顶晾晒农作物,形成独特的“晒秋”景观,既是农事活动,也成为乡村旅游的特色。</p>
<p class="tMid">重阳节的来历 重阳节的起源与多种文化传统相关:</p>
<p>1.天象崇拜与丰收祭祀:上古时期,古人有在季秋举行丰收祭天、祭祖的活动,以感谢天帝和祖先的恩德,这是重阳节作为秋季丰收祭祀活动的原始形式。</p>
<p>2.祭祀“大火”仪式:作为古代季节星宿标志的“大火”(心宿二)在九月隐退,古人认为这象征着漫漫长冬的到来,因此举行送行祭仪,逐渐演变为重阳节的部分习俗。</p>
<p>3.桓景登高避灾传说:东汉时期,汝河瘟魔肆虐,桓景在仙人费长房的指引下,让家人在九月初九登高、佩戴茱萸、饮用菊花酒,成功驱散瘟魔。这一传说为重阳节增添了避灾祈福的寓意。</p>
<p>4.历史演变与融合:汉代后,重阳节习俗从宫廷流传到民间,逐渐形成登高、赏菊、饮菊花酒、插茱萸等风俗。唐代重阳节被正式定为节日,宋代至明清时期,习俗进一步丰富,成为综合性民俗节日。</p>
<p>重阳节承载着丰富的文化内涵,融合了自然崇拜、祖先祭祀、健康祈愿与尊老敬老等多重意义,是中国传统文化的重要组成部分。 </p>
<p class='tRight'>二〇二五年十月二十七日</p>
<div id="player" class="tMid"></div>
<div id="progress" class="gMid"></div>
`;

        tz.text(text, wz);
        tz.add('audio', '', '', {src: 'https://music.163.com/song/media/outer/url?id=25731194'});
        tz.add('img', '','rot-ani', {
                src: 'https://638183.freep.cn/638183/small/snow.webp',
                style: 'width: 80px',
                alt: '小播'
        }).to(player).playmp3();
        tz.bgprog().to(progress);

</script>

也曾年轻 发表于 2025-10-27 15:49

日子过得真快, 又要到一年一度的重阳节了。

也曾年轻 发表于 2025-10-27 15:56

前面的次级标题和图片并没居中

把 .wz p { text-indent: 2em; }
改作
.wz p:not(.tMid):not(.tRight) { text-indent: 2em; }

或许会好些

红影 发表于 2025-10-27 16:02

也曾年轻 发表于 2025-10-27 15:56
前面的次级标题和图片并没居中

把 .wz p { text-indent: 2em; }


厉害了,昨天试过首行缩进就感觉到这个问题,原来可以这样解决{:4_199:}

红影 发表于 2025-10-27 16:07

江南好棒啊,这么快就做出来了,而且内容这么合适,真好{:4_199:}

红影 发表于 2025-10-27 16:09

29号就是重阳节了,在江南的帖子里学习一下重阳习俗真不错。{:4_199:}

也曾年轻 发表于 2025-10-27 16:18

红影 发表于 2025-10-27 16:02
厉害了,昨天试过首行缩进就感觉到这个问题,原来可以这样解决
还可以加一条
.wz p.tMid, .wz p.tRight, .wz p.gMid {
    text-indent: 0em;
}
就是显得笨一点。

梦油 发表于 2025-10-27 16:28

谢谢你的介绍。
祝花潮老年人身体健康、生活幸福。

梦江南 发表于 2025-10-27 16:43

也曾年轻 发表于 2025-10-27 15:49
日子过得真快, 又要到一年一度的重阳节了。

是啊,一年又一年,说快也快说慢也慢。就这样过吧。

梦江南 发表于 2025-10-27 16:45

也曾年轻 发表于 2025-10-27 15:56
前面的次级标题和图片并没居中

把 .wz p { text-indent: 2em; }


我已作了修改,这下图片和次标题居中了。

梦江南 发表于 2025-10-27 16:48

红影 发表于 2025-10-27 16:07
江南好棒啊,这么快就做出来了,而且内容这么合适,真好

学习黑黑老师的这个文章挺需要的,这下正好用上了。得感谢黑黑老师的代码。

梦江南 发表于 2025-10-27 16:49

红影 发表于 2025-10-27 16:09
29号就是重阳节了,在江南的帖子里学习一下重阳习俗真不错。

在现实,也没有这么多规矩讲究了。

梦江南 发表于 2025-10-27 16:52

也曾年轻 发表于 2025-10-27 16:18
还可以加一条
.wz p.tMid, .wz p.tRight, .wz p.gMid {
    text-indent: 0em;


加这一条是起什么 作用呢?现在看看不是可以了吗。

梦江南 发表于 2025-10-27 16:54

梦油 发表于 2025-10-27 16:28
谢谢你的介绍。
祝花潮老年人身体健康、生活幸福。

谢谢你的欣赏,同祝论坛网友重阳节幸福安康。

梦江南 发表于 2025-10-27 16:55

也曾年轻 发表于 2025-10-27 16:18
还可以加一条
.wz p.tMid, .wz p.tRight, .wz p.gMid {
    text-indent: 0em;


可以不加吗?

也曾年轻 发表于 2025-10-27 17:59

梦江南 发表于 2025-10-27 16:52
加这一条是起什么 作用呢?现在看看不是可以了吗。

原来是所有的p标签都有首行缩进,加这条就是让不需要缩进的标签不要缩进。

3楼是改下原设置,7楼是加一条冲掉原来不必要的设置。两种方法都可以,3楼要好些。

也曾年轻 发表于 2025-10-27 18:00

梦江南 发表于 2025-10-27 16:55
可以不加吗?

按3楼改了就需要加了。

梦江南 发表于 2025-10-27 18:01

也曾年轻 发表于 2025-10-27 17:59
原来是所有的p标签都有首行缩进,加这条就是让不需要缩进的标签不要缩进。

3楼是改下原设置,7楼是加 ...

明白了,就不用去改它了。

梦江南 发表于 2025-10-27 18:06

也曾年轻 发表于 2025-10-27 18:00
按3楼改了就需要加了。

我去加上它

澜天 发表于 2025-10-27 18:45

重阳节快乐
{:4_176:}
页: [1] 2
查看完整版本: 重阳节习俗和来历(学习黑黑老师的tzMaker发文章再演示)