一、春联一
1.前言
需要代码文末公众号找我
效果展示
3.代码展示
index.html
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>css3春联切换</title><linkrel="stylesheet"href="css/style.css"></head><body><divclass="rotating-text"><p>春联Show</p><p><spanclass="word alizarin">上联：这个需求很简单</span><spanclass="word wisteria">下联：怎么实现我不管</span><spanclass="word peter-river">横批：明天上线！</span></p></div><scriptsrc="js/script.js"></script></body></html>
style.css
@importurl(https://fonts.googleapis.com/css?family=Lato:600);body{display: flex;justify-content: center;align-items: center;height: 100vh;background: #222;}.rotating-text{font-family: Lato, sans-serif;font-weight: 600;font-size: 36px;color: white;transform:translateX(-80px);}.rotating-text p{display: inline-flex;margin: 0;vertical-align: top;}.rotating-text p .word{position: absolute;display: flex;opacity: 0;}.rotating-text p .word .letter{transform-origin: center center 25px;}.rotating-text p .word .letter.out{transform:rotateX(90deg);transition: 0.32s cubic-bezier(0.6, 0, 0.7, 0.2);}.rotating-text p .word .letter.in{transition: 0.38s ease;}.rotating-text p .word .letter.behind{transform:rotateX(-90deg);}.alizarin{color: #e74c3c;}.wisteria{color: #8e44ad;}.peter-river{color: #3498db;}.emerald{color: #2ecc71;}.sun-flower{color: #f1c40f;}
script.js
var words = document.querySelectorAll(".word");
words.forEach(function(word){var letters = word.textContent.split("");
word.textContent ="";
letters.forEach(function(letter){var span = document.createElement("span");
span.textContent = letter;
span.className ="letter";
word.append(span);});});var currentWordIndex =0;var maxWordIndex = words.length -1;
words[currentWordIndex].style.opacity ="1";varrotateText=function(){var currentWord = words[currentWordIndex];var nextWord = currentWordIndex === maxWordIndex ? words[0]: words[currentWordIndex +1];// rotate out letters of current word
Array.from(currentWord.children).forEach(function(letter, i){setTimeout(function(){
letter.className ="letter out";}, i *80);});// reveal and rotate in letters of next word
nextWord.style.opacity ="1";
Array.from(nextWord.children).forEach(function(letter, i){
letter.className ="letter behind";setTimeout(function(){
letter.className ="letter in";},340+ i *80);});
currentWordIndex =
currentWordIndex === maxWordIndex ?0: currentWordIndex +1;};rotateText();setInterval(rotateText,4000);
二、春联二
1.环境准备
1.当缺少库时会有相应提示 黑窗口执行下方命令+包名即可下载安装
2.博主此处用的idea 直接Alt+Enter直接下载就成了
3.idea配置python环境也可以参考此文:Python(含PyCharm及配置)下载安装以及简单使用(Idea)
2.效果展示
3.代码
import io
from PIL import Image
#import numpy as npimport requests
defget_word(ch, quality):"""获取单个汉字（字符）的图片
ch - 单个汉字或英文字母（仅支持大写）
quality - 单字分辨率，H-640像素，M-480像素，L-320像素
"""
fp = io.BytesIO(requests.post(url='http://xufive.sdysit.com/tk', data={'ch': ch}).content)
im = Image.open(fp)
w, h = im.size
if quality =='M':
w, h =int(w *0.75),int(0.75* h)elif quality =='L':
w, h =int(w *0.5),int(0.5* h)return im.resize((w, h))defget_bg(quality):"""获取春联背景的图片"""return get_word('bg', quality)defwrite_couplets(text, HorV='V', quality='L', out_file=None):"""生成春联
text - 春联内容，以空格断行
HorV - H-横排，V-竖排
quality - 单字分辨率，H-640像素，M-480像素，L-320像素
out_file - 输出文件名
"""
usize ={'H':(640,23),'M':(480,18),'L':(320,12)}
bg_im = get_bg(quality)
text_list =[list(item)for item in text.split()]
rows =len(text_list)
cols =max([len(item)for item in text_list])if HorV =='V':
ow, oh =40+ rows * usize[quality][0]+(rows -1)*10,40+ cols * usize[quality][0]else:
ow, oh =40+ cols * usize[quality][0],40+ rows * usize[quality][0]+(rows -1)*10
out_im = Image.new('RGBA',(ow, oh),'#f0f0f0')for row inrange(rows):if HorV =='V':
row_im = Image.new('RGBA',(usize[quality][0], cols * usize[quality][0]),'white')
offset =(ow -(usize[quality][0]+10)*(row +1)-10,20)else:
row_im = Image.new('RGBA',(cols * usize[quality][0], usize[quality][0]),'white')
offset =(20,20+(usize[quality][0]+10)* row)for col, ch inenumerate(text_list[row]):if HorV =='V':
pos =(0, col * usize[quality][0])else:
pos =(col * usize[quality][0],0)
ch_im = get_word(ch, quality)
row_im.paste(bg_im, pos)
row_im.paste(ch_im,(pos[0]+ usize[quality][1], pos[1]+ usize[quality][1]), mask=ch_im)
out_im.paste(row_im, offset)if out_file:
out_im.convert('RGB').save(out_file)
out_im.show()
text ='思前想后几行代码筑万载春秋 扶内保外一千精英带五千干将'#对联内容
write_couplets(text, HorV='V', quality='M', out_file='春联.jpg')#生成普天同庆.jpg对联图片
本文转载自: https://blog.csdn.net/weixin_45735355/article/details/122574920
版权归原作者 白大锅 所有， 如有侵权，请联系我们删除。
版权归原作者 白大锅 所有， 如有侵权，请联系我们删除。