HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面布局,加上CSS3的效果渲染,快速建立丰富灵活的web页面显得非常简单。 HTML5的新标签元素有: <header>定义页面或区段的头部; <footer>定义页面或区段的尾部; <nav>定义页面或区段的导航区域; <se ...
分类:
Web程序 时间:
2018-04-10 17:51:01
阅读次数:
262
CSS中大部分属性值都有对应的量词单位,常见的如描述盒模型尺寸的 width, height, margin, padding, border,又比如CSS3中的transform属性的一些值。下面的导图中基本上包括了所有的单位,下面将详细介绍它们的定义及使用方式。?一、长度单位1、相对字体长度单位... ...
分类:
Web程序 时间:
2018-04-08 00:25:28
阅读次数:
311
CSS3可以实现制作立方体,代码简单,只是涉及CSS3的一些变换、动画以及过渡属性,而且这些大家都见过,通过制作这个立方体可以让大家更好见识到CSS3的厉害。 实现效果如下图: 立方体是由六个面组成,分上下、左右和前后,考虑这些可以助我们更好的融入css3的代码接下来就是要写代码了:首先我们设一个大 ...
分类:
Web程序 时间:
2018-04-07 16:17:52
阅读次数:
260
前一段时间一直在写CSS3的文章 一直都没写设计模式 今天来写写大名鼎鼎观察者模式 先画张图 观察者模式的理解 我觉得还是发布-订阅模式的叫法更容易我们理解 (不过也有的书上认为它们是两种模式……) 这就类似我们在微信平台订阅了公众号 当它有新的文章发表后,就会推送给我们所有订阅的人 我们可以看到例 ...
分类:
编程语言 时间:
2018-04-06 12:22:38
阅读次数:
207
导读: 弹性盒子是 CSS3 的一种布局模式,一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有适当的行为的布局方式。其中 flex 属性用于指定弹性子元素如何分配空间。 flex 属性的值 flex-grow flex-shrink flex-basis (flex-grow为扩展比率,f ...
分类:
其他好文 时间:
2018-04-05 01:12:43
阅读次数:
212
导读: 弹性盒子是 CSS3 的一种布局模式,一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有适当的行为的布局方式。其中 flex 属性用于指定弹性子元素如何分配空间。 flex 属性的值 flex-grow flex-shrink flex-basis (flex-grow为扩展比率,f ...
分类:
其他好文 时间:
2018-04-04 21:10:14
阅读次数:
184
CSS3 transform 属性 语法: transform: none|transform-functions; transform: none|transform-functions; eg: <!DOCTYPE html><html><head><meta charset="utf-8"> ...
分类:
Web程序 时间:
2018-03-28 20:22:35
阅读次数:
1856
animation的属性大致分为以下几种 animation-name 动画名 animation-duration 动画持续的事件 animation-timing-function 动画的速度曲线,可选的值有 linear--匀速 ; ease--默认。动画以低速开始,然后加快,在结束前变慢。 ...
分类:
Web程序 时间:
2018-03-27 12:31:54
阅读次数:
2127
30种炫酷CSS3鼠标滑过按钮动画特效效果演示:http://www.htmleaf.com/Demo/201510282718.html CSS3鼠标hover按钮过渡动画效果演示:http://www.htmleaf.com/Demo/201708104678.html 基于css3的各种新颖的 ...
分类:
Web程序 时间:
2018-03-21 11:40:08
阅读次数:
229
IE8.0及以下不支持html5,css3的解析。目前为止IE8以下的版本使用率在10%左右,网站还是有必要兼容的。 1,在你的所有css最后判断引入两个js文件。 html5.js 是用来让ie8浏览器能将h5标签转化为块元素 respond.js 是让ie8支持css3的js 2,html5.j ...
分类:
Web程序 时间:
2018-03-16 18:43:38
阅读次数:
1052