CSS和CSS3使用
CSS通常称为CSS样式表或层叠样式表(级联样式表),主要用于设置HTML页面中的文本内容(字体、大小、对齐方式等)、图片的外形(宽高、边框样式、边距等)以及版面的布局等外观显示样式。CSS以HTML为基础,提供了丰富的功能,如字体、颜色、背景的控制及整体排版等,而且还可以针对不同的浏览器设置不同的...
抽奖小案例(js抽奖概率+css3旋转动画)
进入界面后2s开始旋转抽奖,3s后停止,效果图:实现代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="wi...
CSS3基础1
背景 background-image 示例 #example1 { background-image: url(img_flwr.gif), url(paper.gif); background-position: right bottom, left top; ...
CSS3解决连续英文字符或数字不能自动换行的问题
在开发中可能会遇到连续英文字符或数字超出容器边界的问题,如<!DOCTYPE html><html><head><meta charset=" utf-8"><style type="text/css"> .ch{ w...
css3 字体自动换行第二行缩进一格
我们知道css中text-indent属性可以使每个段落首行开头文字缩进,如缩进2个文字距离样式。p{text-indent: 2em; /*em是相对单...
CSS3中的子元素选择器
目录:html5+css3网页设计与制作目录1.子元素选择器>,用来选中某个元素的第一级子元素,也就是儿子元素<!DOCTYPE html&...
jQuery和css3插件大合集
1、jQuery和css3响应式带滚动条的内容手风琴插件这是一款响应式的带滚动条的jQuery和css3内容手风琴插件。该手风琴插件的每个手风琴项都可以带滚动条,并且它的内...
练习使用css3实现3d按钮
网上有很多漂亮的用css3实现的3d按钮,如\'这个\'、‘糖果色按钮’,今天练习了一下,喏,下面这样,兼容性不好。#btncontainer { width: 500px...
CSS3新增伪类选择符:nth-child用法
:nth-childE:nth-child(n) 匹配其父元素的第n个子元素,如果该子元素不是E,则选择符无效。如:p:nth-child(2),匹配父元素的第二个...
小程序中css3实现优惠券
效果如下:css3实现优惠券知识储备颜色渐变 linear-gradient()css伪类 :before :afterindex.wxss 1 .app { 2 ...
用css动态实现圆环百分比分配——初探css3动画
最近的小程序项目有个设计图要求做一个圆环,两种颜色分配,分别代表可用金额和冻结金额。要是就直接这么显示,感觉好像挺没水平??于是我决...
CSS3动画的实例讲解—用CSS3实现摩天轮特效
通过CSS中的animation属性来实现摩天轮旋转的动态效果。在开始之前,先说下animation属性,原理是逐帧动画,通过关键帧控制动画的每一步,来实现最终的动态效果。而常用到的几个属性分别是:1.animation-name,设置元素动画的名字,自定义即可2.animation-duratio...
css3动画案例——会动的立方体盒子
css3动画——立方体盒子给大家分享一个简单好玩的css3动画案例。一个立方体盒子在页面动起来。html 其中6个li代表正方体的六个面,并在每一个面上插入一张图片。完成的效果会更好看。<ul> <li> <img src="./me...
【收藏】20款CSS3动画库,你值得“拥有”
转载自点击这里 今天逛“市场”看到一些不错的CSS3动画库,感觉很不错,就收藏了,分享给大家拉。帮助开发者在一定的期限内取得有创造性和创新性的成果。1.&...
CSS3动画详解(结合实例)
一、使用CSS3动画代替JS动画JS动画频繁操作DOM导致效率非常低在频繁的操作DOM和CSS时,浏览器会不停的执行重排(reflow)和重绘(repaint)可以避免占用JS主线程这边就不细说这两者具体的低优缺点。一般做2D动画的话,可以使用CSS3的transition或animation二、C...
详解CSS3实现无限循环的无缝滚动
思路:克隆A一份完全一样的数据B放在原数据A的后面;使用setInterval向上滚动A的父级容器;当向上滚动的距离L正好的A的高度时(L==A.height())...
纯CSS3按钮边框线条动画特效--底部边框hover从中点向两侧变长
html:<a href=\'\' class=\'ui-box bottom-inOutSpread\'>Audio Description</a>css:.ui-box { text-decoration:none; border:none; font-...
CSS3制作渐变文字
CSS3制作渐变文字(-webkit-mask-image 与 -webkit-background-clip) &...
css3单个元素实现圆角tab
有这样一个用css实现圆角tab的问题,最主要的问题就是双圆角的问题。首先将这个图形分解,一个矩形加上 左右对称的不规则图形,接下来就简单了,实现一个带圆...
实用的html5 css3图片鼠标悬停动画特效
jQuery hover鼠标悬停图片css3动画提示信息div css3 hover transform属性5种鼠标悬停图片背景动画效果JQuery CSS3属性鼠标悬停到图片上感知方向滑动显示文字信息10种纯CSS3 transform鼠标悬停到图片上过渡动画显示图片文字效果纯css3 trans...