#cSS3

CSS3文本阴影、边框阴影

CSS3添加阴影一、使用text-shadow属性为文本添加阴影二、使用box-shadow属性为边框添加阴影 一、为文本添加阴影text-shadow  使用text-shadow,可以在不使用图像表示文本的情况下,为段落、标题等元素中的文本添加动态的阴影效果。(有继承性) &...
代码星球 代码星球·2020-04-14

CSS3自定义滚动条样式

自定义滚动条实现此部分针对webkit内核的浏览器,使用伪类来改变滚动条的默认样式,详情如下:滚动条组成部分1.::-webkit-scrollbar滚动条整体部分2.::-webkit-scrollbar-thumb滚动条里面的小方块,能向上向下移动(或向左向右移动)3.::-webkit-scrollbar-tra...
代码星球 代码星球·2020-04-14

css3 :nth-child(odd奇/even偶)例子

1、北斗第一阳明贪狼星君2、北斗第二阴精巨门星君3、北斗第三真人禄存星君4、北斗第四玄冥文曲星君5、北斗第五丹元廉贞星君6、北斗第六北极武曲星君7、北斗第七天关破军星君效果 ...

CSS3动画特效

  有时候,我们需要给多个元素添加同一个动画,播放后,不难发现它们会一起运动,一起结束,这样就会显得很平淡无奇。那么如何将动画变得稍微有趣一点呢?很简单,既然它们都是同一时刻开始运动的,那么让它们不在同一时刻运动不就可以了吗。如何让它们不在同一时刻运动呢?注意到CSS动画有延迟(delay)这一属性...
代码星球 代码星球·2020-04-13

CSS中的一下小技巧2之CSS3动画勾选运用

  相信大家在项目中会经常遇到这种需求:勾选框。现在用CSS3来实现一个动画勾选,只需要一个标签即可完成:  这次需要用到CSS中伪类 after,这个小技巧也是很容易忘记的,所以决定记录起来~  首先给标签加宽高加背景色:<style>.check{width:40px;height:40px;...

CSS中的一下小技巧1之CSS3三角形运用

  在前端页面中有很多时候会遇到需要三角形图案的时候,以前不知道可以用CSS3实现三角形的时候,一般都是叫UI把三角形图案切出来。  后来知道原来可以用CSS3实现三角形,可是用过一次后很容易忘记,所以想把这个小技巧记录起来~  CSS3是如何实现三角形的呢?——答案是通过边框,也就是borde...

css3 3D盒子效果

1<!DOCTYPEhtml>2<html>3<head>4<metacharset="utf-8">5<title></title>6<style>7body{8margin:0;9}10ul{11margin:0;12padding...
代码星球 代码星球·2020-04-12

css3实现无缝滚动效果

1<!doctypehtml>2<html>3<head>4<metacharset="utf-8">5<title>无标题文档</title>6<style>7@keyframesmove8{90%10{11transform:tra...

css3百叶窗轮播图效果

<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html>   <head&g...
代码星球 代码星球·2020-04-12

css3 media媒体查询器用法总结

  随着响应式设计模型的诞生,Web网站又要发生翻天腹地的改革浪潮,可能有些人会觉得在国内IE6用户居高不下的情况下,这些新的技术还不会广泛的蔓延下去,那你就错了,如今淘宝,凡客,携程等等公司都已经在大胆的尝试了这项技术,并完美的应用在了自己的网站上了。再不更新知识你就老了。我今天就总结一下响应式设...

css3实现钟表特效

<!doctypehtml><html><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"><title>钟表</title><styletype="te...
代码星球 代码星球·2020-04-11

CSS3动画功能

1、transition功能transition属性的使用方法:transition:propertydurationtiming-function其中property表示对哪个属性进行平滑过渡,duration表示多长时间完成属性值的平滑过渡,timing-function表示通过什么方法来进行平滑过渡多平滑过渡示例...
代码星球 代码星球·2020-04-11

CSS3弹性盒布局

1、使用自适应的窗口弹性盒布局可以使div总宽度等于浏览器宽度,而且可以随着浏览器的改变而改变<!DOCTYPEhtml><htmllang="zh-CN"><head><metahttp-equiv="content-type"content="text/html;chars...
代码星球 代码星球·2020-04-11

CSS3动画(360度旋转、旋转放大、放大、移动)

<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Title</title><styletype="text/css">div{width:120px;heig...

CSS3 Filter的十种特效

最近到处看到有人在说CSS3的filter一直没有时间自己去测试这效果。今天终于抽出时间学习这个CSS3的Filter。不整不知道呀,一整才让我感到吃惊,太强大了。大家先来看个效果吧:我想光看上面的效果就能吸引你了,要是你自己动手的话,我想您更会感到神奇。细一看,这些效果就像是photoshop整出来的一样,其实是真是...
代码星球 代码星球·2020-04-11
首页上一页...2223242526...下一页尾页