前段时间有挺火的一个小游戏，拿两张图片叠加在一起，看看复合人物的效果，用css怎么实现呢？可能大部分人想到的是将两个img用定位的方式叠加在一起，分别设置透明度，当然这个办法是可行的，其实css还提供了一个cross-fade()方法，讲两张图片作为背景图引入，可以实现相同的效果。
2024年10月15日
前段时间有挺火的一个小游戏，拿两张图片叠加在一起，看看复合人物的效果，用css怎么实现呢？可能大部分人想到的是将两个img用定位的方式叠加在一起，分别设置透明度，当然这个办法是可行的，其实css还提供了一个cross-fade()方法，讲两张图片作为背景图引入，可以实现相同的效果。
2024年10月15日
本文主要介绍 CSS 滤镜的不常用用法，希望能给读者带来一些干货！
OK，下面直接进入正文。本文所描述的滤镜，指的是 CSS3 出来后的滤镜，不是 IE 系列时代的滤镜，语法如下，还未接触过这个属性的可以先简单到 MDN — filter 了解下：
{ filter: blur(5px); filter: brightness(0.4); filter: contrast(200%); filter: drop-shadow(16px 16px 20px blue); filter: grayscale(50%); filter: hue-rotate(90deg); filter: invert(75%); filter: opacity(25%); filter: saturate(30%); filter: sepia(60%);
2024年10月15日
一 透明边框
在元素上设置透明边框会在边框下边显示元素自己的背景.
在下面的例子中,我们使用rgba将边框设置为透明,但实际上它们显示为纯灰色.
css代码:
div.first{ border:20px solid rgba(0,0,0,0); width:200px;position:absolute; top:50px; left:50px; background-color:red;}
2024年10月15日
CSS Colors
CSS的颜色可以通过以下方法指定：
十六进制颜色
RGB颜色
RGBA颜色
HSL色彩
HSLA颜色
预定义/跨浏览器的颜色名称
十六进制颜色
所有主要浏览器都支持十六进制颜色值。
2024年10月15日
相信不少小伙伴大部分都写过这样的页面，小编找来了一个例子，比如上面图中，文字的黑色背景。给一段文字加背景透明度的时候都遇见过IE不兼容的问题，下面我们聊聊这些问题的处理方法。
我们工作中经常用到添加背景透明度的方法两种：
1.o
2024年10月15日
例：
background: rgba(255,255,255,0.2);
兼容ie8
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#33ffffff,endColorstr=#33ffffff);
#后面的8个数字被拆分为两个部分 33 ffffff他们对应 AA(IEfilter) GGBBAA(GBA)。
2024年10月15日
一说起隐藏HTML页面上的元素，很多人第一反应就是设置元素的css属性display:none;值，这是一种最常见的隐藏页面元素方法。本篇文章我们就一起看看使用CSS隐藏页面元素的方法，以及它们的区别。
本篇文章中的例子直接放到github地址中，感兴趣的同学可以自取。
https://github.com/zhouxiongking/article-pages/blob/master/articles/hideElement/hideElement.html
2024年10月15日
实例
设置一个div元素的透明度级别：
div
{
opacity:0.5;
}
浏览器支持
所有主流浏览器都支持opacity属性。.
注意：IE8和早期版本支持另一种过滤器属性。像：filter:Alpha(opacity=50)
2024年10月15日
background-attachment 定义和用法
background-attachment 属性设置背景图像是否固定或者随着页面的其余部分滚动。
可能的值
实现背景图片固定的实用代码