html5/css3
关注
分享
扫一扫
文章平均质量分 73
文艺er
这个作者很懒，什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
css3中的几个属性：text-shadow、box-shadow 和 border-radius
前三个值分别代码RBG的值，最后一个值代表透明度（0表示透明，1表示不透明）。 RGBA可以用于任何和color有关的属性，例如字体颜色、边框颜色、背景颜色和阴影颜色等。 文字阴影 文字阴影的结构按照这样的顺序：x-offset, y-offset, blur, 和 color。 为x-offset设置负值会将阴影位置改变到左边，为y-offset设置负...原创 2014-07-22 09:49:56 · 523 阅读 · 0 评论 -
css 背景色渐变兼容写法
最近在项目中，有很多地方都用到了线性渐变，比如：表单提交按钮的背景，数据展示的标题背景等等，按照以前的做法是切 1px 图片然后 repeat-x。下面我将介绍如何用 css 来完成该效果。css3：linear-gradient比如：黑色渐变到白色，代码如下：.gradient{ background: -moz-linear-gradient(top, #000000 ...原创 2015-07-23 08:53:09 · 755 阅读 · 0 评论 -
CSS3实现页面淡入动画特效代码
利用CSS3动画属性“@keyframes ”可实现一些动态特效 @keyframes fade-in { 0% {opacity: 0;}/*初始状态 透明度为0*/ 40% {opacity: 0;}/*过渡状态 透明度为0*/ 100% {opacity: 1;}/*结束状态 透明度为1*/ } ...原创 2015-07-11 18:28:06 · 1178 阅读 · 0 评论 -
CSS3实例教程:使用transition制作动感十足的图文切换
<!DOCTYPE HTML><html lang="en-US"><head> <meta charset="UTF-8"> <title>CSS3.0实例教程:使用transition制作动感十足的图文切换</title> <style type="原创 2015-07-05 11:14:59 · 597 阅读 · 0 评论 -
Animator：短小精悍的CSS3动画库
参考：http://www.w3cfuns.com/blog-5458245-5406333.html <div class="main"> <div class="content"> <div id="animate" class="FadeIn"> Animator </原创 2015-07-05 08:47:14 · 610 阅读 · 0 评论 -
transition奥秘
CSS Transition1.基本用法：在CSS3引入Transition（过渡）这个概念之前，CSS是没有时间轴的。也就是说，所有的状态变化，都是即时完成。img{ height:15px; width:15px;}img:hover{ height: 450px; width: 450px;}transition的作用在于，指定状态变化所需要的时间。图片放大的过程需要...原创 2014-09-21 10:08:33 · 315 阅读 · 0 评论 -
完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法
HTML5的语义化标签以及属性，可以让开发者非常方便地实现清晰的web页面布局，加上CSS3的效果渲染，快速建立丰富灵活的web页面显得非常简单。HTML5的新标签元素有：<header>定义页面或区段的头部；<footer>定义页面或区段的尾部；<nav>定义页面或区段的导航区域；<section>页面的逻辑区域或内容组合；...原创 2014-09-10 21:41:06 · 298 阅读 · 0 评论 -
Pure CSS content filter
<h1>FILTER BY COLOR</h1><div class="container"> <input type="radio" id="blue" name="color" /> <label for="blue">BLUE</l原创 2015-06-19 11:18:01 · 446 阅读 · 0 评论 -
css3和jquery实现的可折叠导航菜单(适合手机网页)
<nav class="nav" role="navigation" style="height: 195px;"> <ul class="nav-items"> <li><a target=_blank href="http://www.w2bc.com"&原创 2014-08-28 09:03:05 · 1031 阅读 · 0 评论 -
CSS3动画案例—抖动导航
<!doctype html><html><head><meta charset="utf-8"><title>css3 导航</title><style>*{ padding:0; margin:0;}body{ font-size:12px; font-f原创 2014-08-20 11:53:45 · 341 阅读 · 0 评论 -
纯CSS3多级导航菜单效果代码
<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><title>Examples&原创 2014-08-14 16:44:53 · 825 阅读 · 0 评论 -
用3个步骤实现响应式网页设计
第一步：Meta标签（查看演示）大多数移动浏览器将HTML页面放大为宽的视图（viewport）以符合屏幕分辨率。你可以使用视图的meta标签来进行重置。下面的视图标签告诉浏览器，使用设备的宽度作为视图宽度并禁止初始的缩放。在<head>标签里加入这个meta标签。[html] view plaincopy <meta name="vi...原创 2014-11-04 15:44:57 · 514 阅读 · 0 评论