加林森 发表于 2022-3-23 12:45

《焚情》 - 黄凯芹 （学习黑黑的文字效果）

本帖最后由 加林森 于 2022-5-22 17:01 编辑 <br /><br /><style type="text/css">
.picBtn {
   
      width: 100px;
      height: 100px;
      border: none;
      outline: none;
      border-radius: 8px;
      background: transparent url('http://image.hnol.net/c/2022-02/24/15/202202241559481151-5087368.gif') no-repeat;
      cursor: pointer;
      
</style>

<div style="position: relative; left:-214px; width:1024px;top: 150px; text-align:center;">
      <img alt="" src='https://pic.imgdb.cn/item/6289d2250947543129e42aff.jpg' style="box-shadow:1px 1px 2px #666; border:solid 1px #000;" />
      <div style="position:absolute; width:250px; left:620px; top: 470px; text-align:center;">

<center >
<p ><font color="#FFF0F5" size="3" >

               <marqueescrollamount="4" direction="left" >女大要出嫁-龙梅子 女大要出嫁

谁给我关怀

迟到的缘分风吹干脸庞的泪痕

女大要出嫁

谁给我缘分

溜走的爱情让姻缘何时不离分

生活的压力要爆炸

靓丽的女人也愁嫁

凤毛麟角的好男人

等不来你要的缘分

男大要当婚

女大要出嫁

乞求的爱情没结果

孤单我一人

都说男大当婚

女大要出嫁

身边的男生没感觉

怎么说情话

不是啃老族

就是没希望

坑爹的爱情不敢想象

生活的迷茫

年龄又长大

真想早出嫁

灰姑娘的美梦打碎

现实的童话

工作太忙碌

时间也没着落

羡慕街边的情侣手捧火红的花朵

女大要出嫁

谁给我安慰

迟来的缘分擦不干流下的眼泪

女大要出嫁

谁给我缘分

乞求的爱情没结果

孤单我一人

女大要出嫁

谁给我关怀

迟来的缘分风吹干脸庞的泪痕

女大要出嫁

谁给你缘分

溜走的爱情让姻缘何时不离分

最怕男大当婚

女大要出嫁

追我的男人没条件给我幸福的家

自私太骄傲

就是不可靠

坑妹的爱情不敢想象

生活的美好

老妈打电话

催我快出嫁

白马王子的车轮碾碎梦想的神话

爱情飞走远

心上人看不见

嫉妒身边的恋人牵手走进婚纱店

女大要出嫁

谁给我关怀

迟到的缘分风吹干脸庞的泪痕

女大要出嫁

谁给我缘分

溜走的爱情让姻缘何时不离分

女大要出嫁

谁给我安慰

迟来的缘分擦不干流下的眼泪

女大要出嫁

谁给我缘分

乞求的爱情没结果

孤单我一人

女大要出嫁

谁给我关怀

迟到的缘分风吹干脸庞的泪痕

女大要出嫁

谁给我缘分

溜走的爱情让姻缘何时不离分</marquee>
<div style="position:absolute; width:100px; left:-420px; top: -50px; text-align:center;">
                <p><audio id="music" src="https://www.joy127.com/url/90451.mp3" loop="loop" autoplay="autoplay" ></audio><br> </p>
                <button id="picBtn" class="picBtn"></button>
          </div>
      </div>

<script language="javascript">

var mu = document.getElementById('music');
var btn = document.getElementById('picBtn');

btn.onclick = function(){
      mu.paused ? (mu.play(), btn.style.background="url('http://image.hnol.net/c/2022-02/24/15/202202241559481151-5087368.gif')") : (mu.pause(), btn.style.background="url('http://image.hnol.net/c/2022-02/24/16/20220224160408591-5087368.gif')");
}

mu.addEventListener("ended", function(){
      btn.style.background="url('http://image.hnol.net/c/2022-02/24/16/20220224160408591-5087368.gif')";
})

</script>

<div style="position:absolute; width:500px; left:40px; top: 40px; text-align:center;">
<style type="text/css">
.fireBox {
      margin: auto;
      width: 200px;
      height: 200px;
      line-height: 100px;
      text-align: center;
      text-shadow：100PX;
      font-size: 3rem;
      font-weight: bold;
      color: #CD5C5C;
      background: #00000;
      text-shadow: 0 0 20px #fefcc9, 10px -10px 30px #feec85, -20px -20px 40px #ffae34, 20px -40px 50px #ec760c, -20px -60px 60px #cd4606, 0 -80px 70px #973716, 10px -90px 80px #451b0e;
}

</style>

<div class="fireBox"></div>




<div id="textClock"></div>

<script language="javascript">

showTime();
setInterval(showTime, 1000);

function showTime(){
      var now = new Date();
      var year = now.getFullYear();
      var month = now.getMonth() + 1;
      var date = now.getDate();
      var day = now.getDay();
      var hour = now.getHours();
      if(hour < 10) hour = "0" + hour;
      var minute = now.getMinutes();
      if(minute < 10) minute = "0" + minute;
      var second = now.getSeconds();
      if(second < 10) second = "0" + second;
      document.getElementById("textClock").innerHTML = year + "年" + month + "月" + date + "日 星期" + toHz(day) + "" + hour + ":" + minute + ":" + second;
}

function toHz(num) {
      var hz = "日一二三四五六九";
      return(hz.charAt(num));
}

</script>   </div></div>
<br><br><br><br><br><br><br><br><br><br><br><br>

加林森 发表于 2022-3-23 12:47

@马黑黑   我感觉背景与字好像有点问题，颜色配的不是很理想呢。

加林森 发表于 2022-3-23 13:21

经过几次调整，现在这个字体效果应该是最好的了。

马黑黑 发表于 2022-3-23 13:58

加林森 发表于 2022-3-23 13:21
经过几次调整，现在这个字体效果应该是最好的了。

对，需要调整

马黑黑 发表于 2022-3-23 13:59

同时考虑加 text-shadow，会增强文本阅读的友好性

红影 发表于 2022-3-23 16:42

火焰字。这个做得漂亮，给队长点赞{:4_187:}

加林森 发表于 2022-3-23 17:50

马黑黑 发表于 2022-3-23 13:58
对，需要调整

嗯嗯。

加林森 发表于 2022-3-23 17:52

马黑黑 发表于 2022-3-23 13:59
同时考虑加 text-shadow，会增强文本阅读的友好性

这个我有点蒙了？我做好这个帖就去养老院才回来。

加林森 发表于 2022-3-23 17:52

红影 发表于 2022-3-23 16:42
火焰字。这个做得漂亮，给队长点赞

是的，都是好像火不够大呢？{:4_189:}

马黑黑 发表于 2022-3-23 17:53

加林森 发表于 2022-3-23 17:52
这个我有点蒙了？我做好这个帖就去养老院才回来。

不急慢慢来

加林森 发表于 2022-3-23 17:57

马黑黑 发表于 2022-3-23 13:59
同时考虑加 text-shadow，会增强文本阅读的友好性

添加了，你再帮着看看。

加林森 发表于 2022-3-23 18:00

马黑黑 发表于 2022-3-23 17:53
不急慢慢来

嗯嗯。

马黑黑 发表于 2022-3-23 18:30

加林森 发表于 2022-3-23 17:57
添加了，你再帮着看看。

这样是不是更醒目？

加林森 发表于 2022-3-23 19:07

马黑黑 发表于 2022-3-23 18:30
这样是不是更醒目？

是的，火更加大了，谢谢老黑。{:4_190:}

红影 发表于 2022-3-23 19:27

加林森 发表于 2022-3-23 17:52
是的，都是好像火不够大呢？

已经超出画面了，还不够大啊{:4_173:}

马黑黑 发表于 2022-3-23 19:48

加林森 发表于 2022-3-23 19:07
是的，火更加大了，谢谢老黑。

{:5_108:}

加林森 发表于 2022-3-23 20:11

马黑黑 发表于 2022-3-23 19:48


{:4_190:}

加林森 发表于 2022-3-23 20:12

红影 发表于 2022-3-23 19:27
已经超出画面了，还不够大啊

我修改的效果{:4_189:}

樵歌 发表于 2022-3-23 20:17

做得不错呵。{:4_199:}

加林森 发表于 2022-3-23 20:19

樵歌 发表于 2022-3-23 20:17
做得不错呵。

大火啦{:4_189:}
页: [1] 2
查看完整版本: 《焚情》 - 黄凯芹 （学习黑黑的文字效果）