【实战HTML5与CSS3 第三篇】我第一个HTML5网页诞生了(提供源码)
目录【实战HTML5与CSS3 第一篇】初探水深，美丽的导航，绚丽的图片爆炸！！【实战HTML5与CSS3 第二篇】绚丽的快速导航！【实战HTML5与CSS3 第三篇】我第一个HTML5网页诞生了(提供源码)前言昨天的进度有点延缓，只做了快速导航特效，都是晚上回来一点多才基本结束，其中很多问题也没有...
HTML中的css3过渡详解
1.transition-property:规定设置过渡效果的CSS属性的名称。transition-property:all（默认值）->宽高过渡transition-property:width->宽过渡transition-property:height->高过渡2.tran...
CSS3边框图片、边框阴影、文本阴影
边框图片border-image其有五个属性：border-image-source：边框图片的路径border-image-slice：图片边框向内偏移border-image-width：图片边框的宽度border-image-outer：边框图片区域超出边框的量border-image-rep...
CSS3常用字体属性
·font-size：规定文本的字体尺寸·通常用px，百分比，em来设置字体的大小。如：#div{font-size:50px;}·xx-small、x-small...
CSS3的自定义字体@font-face:将图片ICON转为字体
大家都知道现在各个浏览器都支持CSS3的自定义字体(@font-face)，包括IE6都支持，只是各自对字体文件格式的支持不太一样。那么对于网站中用到的各种icon，我们就...
使用 CSS3 实现超炫的 Loading（加载）动画效果
SpinKit 是一套网页动画效果，包含8种基于 CSS3 实现的很炫的加载动画。借助 CSS3 Animation 的强大功能来创建平滑，易于定制的动画。SpinKit 的目标不是提供一个每个浏览器都兼容的解决方案，而是给现代浏览器提供更加的技术实现方案和使...
本周推荐7款CSS3实现的动态特效
大家都知道，在网页制作时使用CSS技术，可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。只要对相应的代...
CSS3动画效果之transition
CSS3中有两种方式实现动画，transition和animation+@keyframe。两者的作用机制不一样：transition定义在可能要进行动画的元素上，...
如何使用CSS3实现3D效果？
一、首先先做一个平面的3D效果。1.要显示3D效果必须添加perspective（景深），值为px，为观察距离，即观察点到屏幕的距离（Z轴）。代码和效果图如下：二、做一个立方体的3D效果。1.首先在最外层的容器中加上景深perspective，设置值稍微大点，否则拉伸变形影响效果。2.有厚度的模型需...
CSS3中position属性( absolute | relative | static | fixed )详解
我们先来看看CSS3 Api中对position属性的相关定义：static：无特殊定位，对象遵循正常文档流。top，right，bottom，left等属性不会被应用。relative：对象遵循正常文档流，但将依据top，right，bottom，left等属性在正常文档流中偏移位置。而其层叠通过...
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 ...