首页
学习
活动
专区
圈层
工具
发布
    • 综合排序
    • 最热优先
    • 最新优先
    时间不限
  • 来自专栏云前端

    懒人Parcel

    横空出世的Parcel,这几个月来成为了前端圈的又一大热点,github短短几个月就获得了上万的star.

    2.7K10发布于 2020-06-16
  • 来自专栏全栈程序员必看

    精灵

    精灵图 什么是精灵图: css精灵(CSS sprites),是一种网页图片应用处理技术。 主要是指将网页中需要的零星的小图片集成到一个大的图片中 应用的原因: 1.减少对浏览器的请求次数,避免网页的延迟 2.方便小图标的统一管理 精灵图的制作: 1.软件:ps 2.制作方法: 新建透明图层 添加参考线将画布划分,将小图标放入划分好的格子中 精灵图的使用: css精灵图需要配合背景的图片和背景定位 1.引入精灵图 .basic{ background-image:url(

    62410编辑于 2022-06-28
  • 来自专栏kali blog

    懒人神器 Autorecon

    而这需要我们在多款工具中来回切换,因此,本文为大家分享一款更加适合懒人的信息收集工具autorecon AutoRecon是一款信息收集工具,输入目标IP后,就可以自动联动nmap, gobuster,

    9310编辑于 2026-02-28
  • 来自专栏韩曙亮的移动开发专栏

    【CSS】CSS 精灵技术 Sprite ( 精灵技术需求 | CSS 精灵技术简介 | 代码示例 )

    一、精灵技术需求 在浏览器中输入网址 , 向服务器发送请求显示某个网页 , 服务器接受请求 , 将网页数据传递给浏览器 ; 用户访问网站时 , 网页中每张图片都要经过单独请求 , 服务器一次只能传递一张图片给用户浏览器 , 如果网页图像很多 , 服务器与浏览器会频繁地进行请求和响应 , 这样极大的降低了网页的加载速度 ; CSS 精灵技术 , 可以有效提高网页加载技术 ; 二、CSS 精灵技术 ---- CSS 精灵技术 可以 将网页中的 背景图片 合成到一张 精灵图 中 , 网页元素 显示 精灵图 中的某个部位的小图 ; 建议使用 Firework 或者 Photoshop 精确测量精灵图的尺寸与其中小图片的元素位置 ; CSS 精灵技术 的核心就是利用了 背景设置中的 background-position 样式 可以 精确定位要显示图片的位置 ; 设置显示位置 : 设置背景图片显示位置 , 可以从指定 x , ---- 使用下面的图片作为精灵图片 ; 在网页中 , 显示 " 下载游戏 " 按钮 ; 将该 精灵图片 拖到 Fireworks 中 , 使用切片工具选中其中的 下载游戏 按钮 , 先使用切片工具

    1.2K30编辑于 2023-04-24
  • 来自专栏萌海无涯

    Python之pygame学习精灵精灵组(10)

    pygame学习精灵精灵组 ✕ 精灵也就是我们的类操作,定义一个类型的对象,而且pygame封装好了一些对应的操作,方便我们的调用。 ? ? pygame中pygame.sprite.Sprite封装了精灵的操作,我们可以直接继承这个类,来方便的构建我们的精灵精灵的使用分为以下步骤: 定义精灵类: class 类名(pygame.sprite.Sprite): 初始化继承类方法 super().__init__() # 一定要调用! 设置精灵更新操作 可选设置精灵死亡操作 创建精灵 jj = Jl() 创建精灵组 jlz2 = pygame.sprite.Group(填入我们创建的精灵,可以多个) 在循环事件调用精灵组更新事件 jlz.update 完成以上步骤,我们就可以使用精灵组了。 下面代码使用精灵来创建多个反弹球,并且设置精灵的死亡操作! 最后复习一下绘制字体,跟图片。 注意自己要准备个图片!!!

    4.4K20发布于 2019-08-20
  • 来自专栏bye漫漫求学路

    精灵

    把多个小图标放在一张图片上,减少浏览器加载图片的时间,通过代码控制显示哪一个小图标

    64920发布于 2020-10-29
  • 来自专栏河湾欢儿的专栏

    精灵

    什么是精灵图? 就是将几张较小的图片放在一张大图上 为什么要有精灵图? 而将多张小图放到一张大图上的操作就叫做精灵图,也可以叫做雪碧技术 也叫做css sprite 精灵图的使用 一张大的图片上有很多小的图片,那么如何将这个小的图片拿出来呢? 1.如果我们需要的一张图片在精灵图上,必须要了解这个图片的大小以及在精灵图上的位置 比如:新浪网上的搜索按钮,首先得到它的宽高和位置 2.在页面上将这个图片显示出来,在显示的时候一定要注意我们容器的大小一定要和这个图标的大小一样 比如:我们要html页面上放一个div,宽高为图片的搜索按钮的宽高 3.将精灵图设置为容器的背景图片,并且根据图片所在的位置将背景图片进行平移 制作精灵图 1.精灵图必须是一些小的图片 2.精灵图的多个小图之间一定要留有足够的间隙 3.精灵图的大小一定要大于所有图片中最大的那个 4.完成精灵图以后一定要在精灵图下方留有足够的空隙,方便将来再次添加其它的精灵图 5.如果是页面上一个像素的背景图片不要放在精灵图上面 Iconfont

    1.4K10发布于 2018-09-06
  • 来自专栏数据的力量

    懒人管理法

    作为一个创业者,我对自己准确的定位是:一个走了狗屎运的懒人。 最近看到很多新创业者,自我营销水平都相当了不起,产品还八字没一撇的时候,就已经像大师一样给所有人传授经验了,我确实没这本事。 三、谁决策,谁负责 谁决策谁负责,这是我作为一个懒人认为的最好的管理模式。 因为我是一个懒人,所以我做的最多的并不是给团队做加法,而是和团队一起做减法。 这时候,懒人李就出现了。 我有三种角度看团队:一是团队内,二是团队外,三是用户。 五、好好学习,天天访问 由于团队给力,我这个懒人每天就只给自己安排很少的事情,我还是砍会议的高手,可有可无的例会一律砍掉。这样,我自己就有了大量的时间,到底干点什么呢?

    73730发布于 2018-07-23
  • 来自专栏木制robot技术杂谈

    懒人神器 autoenv

    前言 每次去不同的项目下运行程序都要更改相对应的 Python 环境,那么有什么办法可以省去这繁琐的一步吗?答案肯定是有的,Kenneth Reitz 已经为我们实现了—— autoenv。这个人名你可能没见过,但是说起他的另一个身份你肯定知道—— Requests 库的作者。 安装 Mac OS X 使用 Homebrew 安装 $ brew install autoenv # bash 使用这条命令 $ echo "source $(brew --prefix autoenv)/activate.sh

    1.7K60发布于 2018-04-13
  • 来自专栏全栈程序员必看

    精灵图定位

    url(…/images/sprite-search.png) no-repeat; } .search em:hover{ background-position: -30px 0; /* 精灵图第一个值是 X轴的值 第二个值是Y轴的值,基本上都是负的多少多少 */ } 精灵图本质: 用一张大图包含所有小图,最关键的地方在于使用backgrond-postion属性精确定位 发布者:全栈程序员栈长,转载请注明出处

    51830编辑于 2022-08-24
  • 来自专栏全栈程序员必看

    关于精灵

    之前就发现一些网站把所有的小图标拼接在一张图片中,但是一直不知道这是怎么做到的,今天特地了解了一下,才知道这种用法叫做精灵图。

    66220编辑于 2022-09-02
  • 来自专栏python3

    Python——动画精灵

    下面就要介绍这一篇的主角——动画精灵,pygame有一个特殊的模块来处理动画精灵。 一. 什么是动画精灵 动画精灵表示一个单位来移动和显示一组像素,这是一种图形对象。 “动画精灵”这个词是从老式计算机和游戏机流传下来的。这些老式游戏机不能很快地绘制和擦除图形来保证游戏正常工作。这些游戏机有一些特殊的硬件,专门用来处理需要快速移动的游戏对象。 这些对象就称为“动画精灵”。它们有一些特殊的限制,不过可以非常快地绘制和更新……如今,一般来讲,计算机的速度已经足够快了,不需要专门的硬件也可以很好地处理类似动画精灵的对象。 不过‘动画精灵’这个词仍用来便是二维游戏中的所有动画对象。 可以把动画精灵想成一个小图片——一种可以在屏幕上移动的图形对象,并且可以与其他图形对象交互。 二. Sprite类 Pygame的sprite模块提供了一个动画精灵基类,名为sprite。

    1.5K20发布于 2020-01-07
  • 来自专栏全栈程序员必看

    精灵图 详解

    精灵图技术 why? 1.减少请求次数,提高界面加载速度 what? 1.确定显示小图片的那个盒子的宽高 2.以背景的方式插入精灵图 background-image:url(); 3.移动图片的定位位置 background-position:xpx ypx 向上移动以及向左移动 位置肯定是负值 注:background-position: 水平/px 垂直/px 打开PS,打开所要用的精灵图。 /资料/精灵图应用_看图王.png); background-repeat: no-repeat; background-position: -303px -13px; !

    95920编辑于 2022-08-23
  • 来自专栏Sign

    精灵之息

    因为菜单列表里的那篇精灵之息是之前版本的,所以重新发一篇 ? 如果精灵之息把所有规则摊开了讲,大概要10-20分钟,但是,现在第一章的内容还不到20分钟……这样太糟糕了。 精灵之息目前属于后者。 其实我比较担心会得到『游戏做一半就拿来上架』的评价。 但…… 总之,现阶段的精灵之息是『体验版』的感觉,但是我也只能这么发了,后续会一章一章的更新。

    75910发布于 2018-12-18
  • 来自专栏生如夏花绚烂

    CSS Sprites(精灵图)

    使用精灵图 通过定义我们知道,css精灵其实就是将网页中的一些背景图像整合到一张大图中,我们需使用精灵图里面的某个小图片就需要通过css的background-image(引入精灵图),background-repeat (指定不重复), background-position(确定小图在精灵图中的位置,必须精确定位) 接下来看一下一些大型网页是否使用了精灵图 如淘宝页面 通过审查元素,查看右边小图标是否使用了精灵图 1.将精灵图用ps打开 为了避免改变精灵图的位置,我们第一次打开时需将图层锁定 通过选取工具,选取我们需要的图片得到其大小位置信息,图片的信息在“窗口”---“信息”。 制作精灵图就是将小图标放图一个大的背景中即可,这里就不一一阐述,精灵图制作遵循一下原则 1.精灵图必须为透明背景 2.精灵图中个各个小图应该有一定的间距 3.精灵图底部应该预留位置方便以后添加 4.精灵图存储为png格式

    1.4K20编辑于 2022-09-08
  • 来自专栏FEWY

    学习 PixiJS — 精灵状态

    如果要开始使用精灵状态,首先需要一个状态播放器。状态播放器用于控制精灵状态。 ,这个动画精灵会内置了一个状态播放器。 第二个参数 xPosition 和 第三个参数 yPosition 表示创建的精灵的 x 和 y 坐标。 什么是精灵状态? 这个雪碧图中实际上有八个精灵状态:四个静态状态和四个动画状态。让我们看看这些状态是什么以及如何定义它们。 静态状态 精灵的静态状态定义精灵在不移动时的四个位置。 首先,创建精灵,以下代码展示了如何使用 sprite 方法创建精灵

    2.6K10发布于 2019-05-26
  • 来自专栏全栈程序员必看

    html精灵图跟img标签,css精灵图怎么使用?

    什么是css精灵图(sprite)?css精灵图怎么使用?下面本篇文章就来给大家介绍一下css精灵图的使用。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。 在了解精灵图怎么使用前,我们要先知道什么是精灵图。只有先知道什么是精灵图,了解精灵图的原理了,我们才可是说使用精灵图。 什么是css精灵图(sprite)? css精灵图(sprite)直译为“CSS精灵”,也被称为通常被解释为“CSS图像拼合”、“CSS贴图定位”或“CSS图片精灵”、“CSS雪碧图”,是一种网页图片应用处理方式。 怎么使用css精灵图(sprite)? css精灵图(sprite)其实就是通过将多个图片融合到一张图片文件中,然后通过CSS background背景定位技术技巧布局网页背景。 精灵图在后期维护上也带来了一定麻烦,因为所有的图片是在一张图片上,甚至位置都是相互影响的,所以一旦改变了一个,可能整张精灵图都需要重新做。

    2.5K30编辑于 2022-08-23
  • 来自专栏网页杂谈

    Python制作《精灵进化》

    通过项目《精灵进化》的制作,熟悉游戏过程中角色的移动和变化及游戏结束效果。

    68810编辑于 2022-11-11
  • 来自专栏全栈程序员必看

    CSS精灵图(sprite)

    说到精灵图(雪碧图),大家肯定和我一样觉得这个很新鲜。在学习了有关精灵图(雪碧图)的一些知识后,就来和大家讨论一下,我个人对精灵图(雪碧图)的一些理解和实现方法吧。 1、精灵图技术产生的目的:很多大型网页在首次加载的时候都需要加载很多的小图片,而考虑到在同一时间,服务器拥堵的情况下,为了解决这一问题,采用了精灵图这一技术来缓解加载时间过长从而影响用户体验的这个问题。 2、精灵图技术的本质:所谓精灵图就是把很多的小图片合并到一张较大的图片里,所以在首次加载页面的时候,就不用加载过多的小图片,只需要加载出来将小图片合并起来的那一张大图片也就是精灵图即可,这样在一定程度上减少了页面的加载速度 例如这是一张大的精灵图,我们现在用它来拼出我们想要的字母,例如ANDY <! 精灵图虽然实现了缓解服务器压力以及用户体验等问题,但还是有一个很大的不足,那就是牵一发而动全身。这些图片的背景都是我们详细测量而得出来的,如果需要改动页面,将会是很麻烦的一项工作。。。

    1.1K10编辑于 2022-06-28
  • 来自专栏小白安全

    文件包含漏洞-懒人安全

    一.漏洞描述 文件包含漏洞主要是程序员把一些公用的代码写在一个单独的文件中,然后使用其他文件进行包含调用,如果需要包含的文件是使用硬编码的,那么一般是不会出现安全问题,但是有时可能不确定需要包含哪些具体文件,所以就会采用变量的形式来传递需要包含的文件,但是在使用包含文件的过程中,未对包含的变量进行检查及过滤,导致外部提交的恶意数据作为变量进入到了文件包含的过程中,从而导致提交的恶意数据被执行,主要用来绕过waf上传木马文件。 二.漏洞分类 0x01本地文件包含:可以包含本地文件,在条件

    1.8K80发布于 2018-04-16
领券