我们在开发的过程中经常会遇到背景色是渐变的背景色,一般可以制作背景图,如果仅仅是简单的线性变换的背景,今天我就遇到了,其实完全可以用CSS3的渐变来实现这个效果。这个过程由浏览器来生成,不用去加载静态的资源,提高性能。 渐变有两种: 线性渐变(Linear Gradients)- 向下/向上/向左/ ...
分类:
Web程序 时间:
2020-07-24 15:26:11
阅读次数:
90
什么是属性前缀? 为了浏览器的兼容性,有时候我们必须加入-webkit,-ms,-o,-moz这些前缀。目的就是让我们写的页面在每个浏览器中都可以顺利运行。例如: transition: width 2s; -moz-transition: width 2s; /* Firefox 4 */ -we ...
分类:
Web程序 时间:
2020-07-23 01:51:35
阅读次数:
113
css3属性中关于制作动画的三个属性:Transform,Transition,Animation。 1、transform:描述了元素的静态样式,本身不会呈现动画效果,可以对元素进行 旋转rotate、扭曲skew、缩放scale和移动translate以及矩阵变形matrix。 div{ tra ...
分类:
Web程序 时间:
2020-07-22 23:36:58
阅读次数:
115
“常说,要认识一个人①,大概了解一下背景,然后见面时打招呼讲什么语言规矩范礼②,她回应了,声音很好听,你会继续选择③用选择什么语气对待?而且又怎么漂亮,相信自己不会拒绝④的,来预先处理⑤好情绪,好让彼此能有一个新的开始⑥,给生活一个甜美的谜底吧⑦”--晚安,EmilyChen! (一)CSS简介 C ...
分类:
Web程序 时间:
2020-07-22 20:27:08
阅读次数:
122
今日完成任务 网页布局 1. bootStrap栅格系统 响应式web布局是让用户通过不同尺寸的浏览器都可以获得良好视觉的一种方法。是目前比较流行的一种布局方法。 通过CSS3 Media Queries(媒体查询),媒体查询是让页面内容在不同的媒体环境下运行时可以展示不同的样式。@media是CS ...
分类:
Web程序 时间:
2020-07-22 15:47:05
阅读次数:
119
1、CSS Filter 使用CSS过滤器属性可能是最简单的方法把图像变成灰度。以往,IE浏览器有一个专有的CSS属性称为过滤应用自定义效果包括灰度。 现在,过滤器属性是CSS3规范的一部分,并支持在一些浏览器,Firefox、Chrome和Safari。以前,我们也提到Webkit过滤器,它不仅将 ...
分类:
其他好文 时间:
2020-07-21 21:55:21
阅读次数:
131
css控制div的各种形状 CSS3的一个非常酷的特性是允许我们创建各种规则和不规则形状的图形,从而可以减少图片的使用。 以前只能在Photoshop等图像编辑软件中制作的复杂图形现在使用CSS3就可以完成了。 通过使用新的CSS属性,像transform和border-radius,我们可以创建非 ...
分类:
Web程序 时间:
2020-07-21 14:10:39
阅读次数:
121
html5+css3响应式垂直时间轴,使用了html5标签<section>,时间轴中所有的内容包括标题、简介、时间和图像都放在.cd-timeline-block的div中,多个div形成一个序列,并把这些div放在<section>中。 PC端: 移动端: html代码: <!DOCTYPE h ...
分类:
Web程序 时间:
2020-07-19 18:11:56
阅读次数:
166
应用DivCSS网页布局,经常性地会使用到float,很多邪门的事儿都有可能是浮动在作怪,清除浮动是必须要做的,而且随时性地对父级元素清除浮动的做法也被认为是书写CSS的良好习惯之一。下面看今天的教程,此为未清除浮动源代码,运行代码无法查看到父级元素浅黄色背景。 <style type=”text/ ...
分类:
Web程序 时间:
2020-07-19 16:18:39
阅读次数:
80
今天就重点讲解这个效果,首先,当有人说你能不能做一个圆形进度条效果出来时,如果是静态完整圆形进度条,那么就很简单了: .circleprogress{ width: 160px; height: 160px; border:20px solid red; border-radius: 50%; } ...
分类:
Web程序 时间:
2020-07-19 16:15:54
阅读次数:
72