葬花吟(学习黑师图文小贴子作业之二)

南无月

花谢花飞花满天，红消香断有谁怜？
游丝软系飘春榭，落絮轻沾扑绣帘。
闺中女儿惜春暮，愁绪满怀无释处。
手把花锄出绣帘，忍踏落花来复去。
柳丝榆荚自芳菲，不管桃飘与李飞；
桃李明年能再发，明年闺中知有谁？
三月香巢已垒成，梁间燕子太无情！
明年花发虽可啄，
却不道人去梁空巢也倾。
一年三百六十日，风刀霜剑严相逼；
明媚鲜妍能几时，一朝漂泊难寻觅。
花开易见落难寻，阶前愁杀葬花人，
独倚花锄泪暗洒，洒上空枝见血痕。
杜鹃无语正黄昏，荷锄归去掩重门；
青灯照壁人初睡，冷雨敲窗被未温。
怪奴底事倍伤神？半为怜春半恼春。
怜春忽至恼忽去，至又无言去未闻。
昨宵庭外悲歌发，知是花魂与鸟魂？
花魂鸟魂总难留，鸟自无言花自羞；
愿侬此日生双翼，随花飞到天尽头。
天尽头，何处有香丘？
未若锦囊收艳骨，一抔净土掩风流。
质本洁来还洁去，强于污淖陷渠沟。
尔今死去侬收葬，未卜侬身何日丧？
侬今葬花人笑痴，他年葬侬知是谁？
试看春残花渐落，便是红颜老死时；
一朝春尽红颜老，花落人亡两不知！

:doodle { @size: 50px; position: absolute;cursor: pointer; left: 185px; top: 12px; opacity: .96;z-index: 14; }clip-path: @shape(fill: evenodd;points: 300;scale: .45;x: cos(2t) + cos(7t);y: sin(2t) + sin(7t););background: linear-gradient(LightCyan,MediumPurple,Thistle);animation: rot 6s infinite linear var(--state);@keyframes rot { to { transform: rotate(360deg); } }

小文

十分欣赏,喜欢这样的风格.问好!

南无月

小文 发表于 2023-7-7 10:26
十分欣赏,喜欢这样的风格.问好!

谢谢小文哦，你也可以用这种来写文字。

红影

把边框加到底图中，还弄了这么多漂亮的动态以及漂亮的播放器按钮。月儿的制作好棒

山人

梦回后楼

南无月

@马黑黑 老师来瞧瞧，用你说的方法加了滚动条，可以完整显示整首诗了

南无月

红影 发表于 2023-7-7 11:15
把边框加到底图中，还弄了这么多漂亮的动态以及漂亮的播放器按钮。月儿的制作好棒

练习作业，简单的效果堆砌谢谢影子鼓励

南无月

山人 发表于 2023-7-7 11:42
梦回后楼

梦回红楼。。。经典曲子，可以一听

马黑黑

南无月 发表于 2023-7-7 13:19
梦回红楼。。。经典曲子，可以一听

听说红楼在俺家后面

马黑黑

南无月 发表于 2023-7-7 13:17
@马黑黑 老师来瞧瞧，用你说的方法加了滚动条，可以完整显示整首诗了

CSS滚动条相关设置：

overflow - 设置xy两个方向的滚动条，值为 auto（自动）、hidden（隐藏）。当元素固定了宽高尺寸，值为 auto 时，内容多了或行长了，滚动条就会自动出现；值为 hidden 时，滚动条永远不会出现。确实值是 hidden。

还可以单独设置xy两个方向，取值与 overflow 一样：

overflow-x : 设置水平方向的滚动条
overflow-y : 设置垂直方向的滚动条

马黑黑

这个帖子构思巧妙，设计大气，布局合理得当，整体效果奔放中有细腻、凄凉中有希望，挺好。

“各美其美”的布局设想没有实现，是对 HTML 布局还没有能够做到全局把握。比方说，css-doodle 的效果只想修饰右边区域某些范围，则可以在CSS中的 css-doodle 标签中定位 css-doodle 和规定它的尺寸：

css-doodle {
    position: absolute;
    width: 600px;
    height: 400px;
    left: 500px;
    top: 100px;
}

css-doodle 选择器如果有 id，比如说 id="mydd" ，则上面的 css-doodle 标签名称可以用 #mydd 代替，避免一个元素用多组选择器去进行设置。

山人

南无月 发表于 2023-7-7 13:19
梦回红楼。。。经典曲子，可以一听

听听

南无月

马黑黑 发表于 2023-7-7 17:59
听说红楼在俺家后面

你家后山头上有个大观园

南无月

马黑黑 发表于 2023-7-7 18:03
CSS滚动条相关设置：

overflow - 设置xy两个方向的滚动条，值为 auto（自动）、hidden（隐藏）。当元 ...

hidden，我试了没用啊，藏得完全看不到，也没有滚动效果

南无月

马黑黑 发表于 2023-7-7 18:10
这个帖子构思巧妙，设计大气，布局合理得当，整体效果奔放中有细腻、凄凉中有希望，挺好。

“各美其美” ...

好的。我以后做贴的时候留意

马黑黑

南无月 发表于 2023-7-7 20:06
好的。我以后做贴的时候留意

马黑黑

南无月 发表于 2023-7-7 19:59
hidden，我试了没用啊，藏得完全看不到，也没有滚动效果

hidden就是不让滚动条出现

马黑黑

南无月 发表于 2023-7-7 19:57
你家后山头上有个大观园

画上画的

南无月

山人 发表于 2023-7-7 19:49
听听

好的，我到是听了好多遍

南无月

马黑黑 发表于 2023-7-7 20:08
hidden就是不让滚动条出现

就是终止滚动效果？不让它出现，不设这个就行了。。。设了又不让出现，有什么差别呢。