zoukankan      html  css  js  c++  java
  • 用CSS box-shadow画画

    原理:找一幅画,每隔5 pixel取一个点的RGB,在CSS中用box-shadow描绘出这个点

    Python

    from PIL import Image
    
    if __name__ == '__main__':
    
        with open('C:\css.txt', 'w') as f:
            im = Image.open('C:\sky.jpg')
            for x in range(0, im.size[0], 5):
                for y in range(0, im.size[1], 5):
                    line = '{0}px {1}px 5px 4px rgb{2},
    '.format(x, y, im.getpixel((x, y)))
                    f.write(line)

    HTML

    <html>
        <head>
        </head>
        <body>
            <div id="painter"></div>
            <style>
                html{
                    margin:0; padding:0;
                }
                #painter{
                    width:0px; height:0px;
                    position:relative; left:100px; top:100px;
                    box-shadow: 0px 0px 5px 4px rgb(100, 105, 108),
    0px 5px 5px 4px rgb(130, 163, 170),
    0px 10px 5px 4px rgb(177, 180, 137),
    0px 15px 5px 4px rgb(102, 119, 145),
    .................
    895px 555px 5px 4px rgb(32, 23, 28),
    895px 560px 5px 4px rgb(32, 16, 17);
                }
            </style>
        </body>
    </html>

    效果

    下图并不是图片 微笑

     
  • 相关阅读:
    Exercise 3: Numbers And Math
    Exercise 1: A Good First Program
    Lambda表达式详解
    @CacheEvict中的allEntries与beforeInvocation
    swagger接口文档查看地址
    开发常用软件下载
    mybatis中的<trim prefix="" suffix="" suffixOverrides="" prefixOverrides=""></trim>说明
    Git初使用
    vue.js的引用地址
    Git push代码到远程仓库
  • 原文地址:https://www.cnblogs.com/technology/p/5071720.html
Copyright © 2011-2022 走看看