CSS3
文章平均质量分 72
马灿发
前端爱好者,主攻于web前端开发
展开
-
响应式布局基本实现Media Query(媒介查询)
Media Query的使用方法、设备类型、设备特性、特殊情况、在bootstrap中的应用...原创 2016-06-10 20:59:59 · 15131 阅读 · 0 评论 -
CSS3实现“圣杯布局”--(固比固布局)
使用CSS3中的属性order可以轻易实现“圣杯布局”,实现伸缩项目的顺序重组,还有!!!使用flex属性实现了中间列的等高效果,以及页脚的黏附效果。原创 2016-07-06 20:21:24 · 2350 阅读 · 0 评论 -
CSS3 3D变形
3D变换的功能函数和3D属性,以及需要注意的知识点和技巧!原创 2016-07-18 00:32:28 · 998 阅读 · 0 评论 -
CSS3实现手机网页3D切换效果
使用CSS3 3D变形来实现手机网页的切换效果,相信在H5微场景大有用处!预先定义好各场景的空间关系以及内容部分的定位隐藏,通过切换类名来实现切换效果!原创 2016-07-18 00:52:01 · 3456 阅读 · 0 评论 -
3D拖拽相册
很久之前练习过的一个实践,复习完渐变、圆角、3D变形、拖拽等等来看源码,估计还不会太凌乱(◎﹏◎)哈哈哈效果图:原创 2016-07-18 01:19:15 · 1632 阅读 · 0 评论 -
CSS3 box-reflect(倒影效果)
之前那只能使用PS先将倒影设计好,然后再利用其进行开发。现在box-reflect属性可以进行图片、文字甚至视频等的倒影制作。但是!目前只在webkit浏览器下支持!需要加上私有前缀-webkit- !倒影效果不会对其他元素造成影响,不影响页面布局原创 2016-07-06 22:49:21 · 1061 阅读 · 0 评论 -
CSS3背景
本文简单整理了CSS3背景的几个知识点:背景的五大基本属性,以及新增的四个属性:background-origin、background-clip、background-size、background-break以及多背景简单使用原创 2016-07-01 20:45:20 · 622 阅读 · 0 评论 -
CSS3 Transform(2D变换)
总结了CSS3中的2D变换,四大变形函数,以及translate 与绝对定位、相对定位的区别,rotate()函数的应用技巧和shew()函数的使用场景和技巧!打好基础,才能很好运用CSS3中的3D变换。原创 2016-07-17 21:46:40 · 1604 阅读 · 0 评论 -
CSS3线性渐变(linear-gradient)
主要整理了下CSS3线性渐变在各大浏览器下的兼容写法,各个方向渐变的使用用法以及多色线性渐变的简要写法!原创 2016-07-07 19:20:56 · 1796 阅读 · 0 评论 -
CSS3径向渐变(radial-gradient)
主要整理了下CSS3径向渐变在各大浏览器下的兼容写法,属性参数、各个圆心定位点渐变的使用用法以及多色渐变的简要写法!原创 2016-07-07 20:04:51 · 3962 阅读 · 0 评论 -
CSS3弹性伸缩布局盒(Flexible Box)模型
主要整理了Flexbox模型布局功能、属性术语、语法规范、各版本语法变更和新版本Flexbox模型!除此之外,还有更头疼的是浏览器兼容性,需要多次练习整理才能好好使用伸缩布局模型来解决布局问题。原创 2016-07-06 19:48:17 · 9132 阅读 · 3 评论 -
CSS3过渡transition
CSS3过渡transition在过渡动画效果方面确实不错,可以模拟简单的动画交互效果,简单总结属性以及相关知识!不过配合到CSS3的动画animation估计更添趣味!原创 2016-07-17 17:12:11 · 1709 阅读 · 0 评论 -
css3选择器
css3:属性选择器、结构性伪类选择器、UI元素状态伪类选择器、通用兄弟元素选择器原创 2016-06-10 22:56:11 · 839 阅读 · 0 评论 -
前端案例--纯css3实现怪异选项卡
怪异选项卡:实现css自增排序、自制css边框扇形,背景渐变**涉及知识点:**css伪类、伪元素、自增排序编号、border、border-radius、背景渐变原创 2016-06-11 14:02:32 · 1421 阅读 · 0 评论 -
CSS3边框
本文介绍CSS3中的边框的基本属性、多颜色边框和图片边框!原创 2016-06-12 11:11:19 · 563 阅读 · 0 评论 -
CSS3圆角边框
本文介绍border-radius的使用、应用、特殊圆形的制作等!原创 2016-06-12 13:04:28 · 4750 阅读 · 0 评论 -
CSS3盒阴影box-shadow
本文介绍了CSS3中的盒子阴影box-shadow,包括单边实影和单边阴影、两种四边阴影、内阴影、多层阴影等!以及结合边框圆角、变形、旋转、调整层级关系等属性实现了曲边阴影和翘边阴影效果!原创 2016-06-12 15:47:58 · 4751 阅读 · 0 评论 -
前端案例--CSS3实现图片光影效果
纯CSS3实现图片光影效果,主要用到了背景渐变的知识以及其中需要注意的细节!interesting...原创 2016-07-10 20:16:28 · 4864 阅读 · 0 评论 -
CSS3盒模型
主要是整理了CSS中的两种盒模型:W3C标准盒模型和IE传统盒模型;布局救星:box-sizing;内容溢出属性overflow;自由缩放属性resize和外轮廓属性outline。主要作用多用于处理各大浏览器中的布局,内容以及样式方面的应用。原创 2016-07-02 10:20:31 · 581 阅读 · 0 评论 -
CSS3多列布局
要达到类似于报纸或杂志的排版效果,无需增加无用的标签或依赖于浮动或定位来实现布局效果。熟悉使用列宽column-width、列数column-count、列间距column-gap、列边框column-rule、跨列column-span和列高度column-fill等六大属性进行排版布局,解决此等排版难题。原创 2016-07-02 11:39:32 · 887 阅读 · 0 评论 -
前端案例--纯CSS3美化复选框
技巧:将input按钮和美化内容都放在label标签内,再通过定位将input按钮溢出隐藏!使用CSS3中的E:checked伪类选择器触发美化表单!纯CSS3美化复选框效果图:HTML:原创 2016-07-06 00:41:28 · 3328 阅读 · 0 评论 -
CSS3文本
本文整理了CSS3文本的文本的各大属性、文本阴影、文本溢出、文本换行等,需要辅助以实战练习才能很好的理解与使用其中的属性原创 2016-07-01 22:08:39 · 506 阅读 · 0 评论 -
CSS3重复渐变(线性和径向渐变)
重复渐变的基本语法、利用重复渐变制作记事本纸张效果、纹理背景图以及个人注意到的平滑过渡渐变和突然过渡渐变!原创 2016-07-08 08:29:00 · 10469 阅读 · 0 评论