文字效果集中营

马黑黑

加林森 发表于 2022-3-13 22:57
这个有点厉害，特别是改变颜色怎么变呢。

还行啊

加林森

马黑黑 发表于 2022-3-13 22:58
还行啊

惭愧惭愧

小辣椒

马黑黑 发表于 2022-3-12 20:55
这个纯属原创哈

黑黑太佩服你了，原创厉害的

马黑黑

小辣椒 发表于 2022-3-13 23:04
黑黑太佩服你了，原创厉害的

感谢支持

小辣椒

马黑黑 发表于 2022-3-13 23:09
感谢支持

我被窝里面手机看看，感觉这个要电脑看，一面看，一面预览效果。感觉特别好

马黑黑

小辣椒 发表于 2022-3-13 23:11
我被窝里面手机看看，感觉这个要电脑看，一面看，一面预览效果。感觉特别好

那么用功

加林森

马黑黑 发表于 2022-3-13 23:14
那么用功

继续学习

马黑黑

加林森 发表于 2022-3-13 23:22
继续学习

加林森

马黑黑 发表于 2022-3-14 12:02

谢谢老黑。

马黑黑

加林森 发表于 2022-3-14 12:25
谢谢老黑。

不客气的

加林森

马黑黑 发表于 2022-3-14 12:41
不客气的

嗯嗯，中午好。

马黑黑

加林森 发表于 2022-3-14 12:42
嗯嗯，中午好。

马黑黑

HELLO CSS!

马黑黑

纯CSS文本自动变色代码：

<style>
/* 文本层 */
.txtCeng {
        margin: 10px auto 0;
        width: 400px;
        height: 200px;
        line-height: 200px;
        font-family: Arial, '微软雅黑';
        font-size: 4em;
        color: #eee;
        text-align: center;
        text-shadow: 1px 1px 1px #ffcc00, 2px 2px 2px #aaa;
        background: rgba(255, 255, 255, .1);
        animation: chgColor 5s ease-in-out infinite alternate;
}
/* 文本层变色 */
@keyframes chgColor {
        0% { color: navy; }
        20% { color: green; }
        40% { color: red; }
        60% { color: olive; }
        80% { color: olive; }
        100% { color: tomato; }
}
</style>

<div class="txtCeng">HELLO CSS!</div>

加林森

马黑黑 发表于 2022-3-14 12:54

谢谢。

老黑的教程真好！

马黑黑

加林森 发表于 2022-3-14 13:02
本帖最后由 加林森 于 2022-3-14 13:05 编辑
谢谢。

你可以把盒子的宽度改大一点，760是论坛的支持下限

加林森

马黑黑 发表于 2022-3-14 13:07
你可以吧盒子的宽度改大一点，760是论坛的支持下限

哦，好的好的，知道了。谢谢！

马黑黑

加林森 发表于 2022-3-14 13:09
哦，好的好的，知道了。谢谢！

我帮你改了，你看一下代码，体会一下

马黑黑

加林森 发表于 2022-3-14 13:09
哦，好的好的，知道了。谢谢！

凡用 .xxx 命名的CSS选择器，同一页里不要复制一份，没必要，也会在后面的有改动的情况下干扰前面的。你只需要在HTML代码中引用 .xxx 名称：

<div class="xxx">文字</div>

然后，有需要改动的，用style追加其他属性，如宽度、文字大小什么的：

<div class="xxx" style="width: 700px; font-size: 4em;">文字</div>

加林森

马黑黑 发表于 2022-3-14 13:14
凡用 .xxx 命名的CSS选择器，同一页里不要复制一份，没必要，也会在后面的有改动的情况下干扰前面的。你 ...

嗯嗯，明白了。