by zhangxinxu from http://www.zhangxinxu.com本文地址：http://www.zhangxinxu.com/wordpress/?p=1268 一、前言兼目录索引 《天龙八部》里的虚竹小和尚之前可以说是和尚的先进人物与代表模范，各类清规戒律谨记与严守。但是，后来呢，花姑娘送到跟前，什么戒律都成了浮云，禁不住诱惑享乐去了。啊，我现在似乎有类似的感觉，本来不打 »
今天学习了css3美化页面元素，它可以使网页更加的优美，漂亮，是用户有更好的体验。 css3美化网页元素的优点： 1.有效的传递压面信息 2.是页面漂亮、美观、吸引用户 3.可以更好的凸显出页面的主题，使得用户能在最短时间看到页面的主要内容 4.有良好的用户体验 css3页面元素样式： 文字样式： 1.font-family:“字体”；设置文字类型 2.font-size:12px; 设置文字大小 »
当我们在网站上注册登录还是提交评论，都需要用到表单，今天我们来分享8款最新CSS3表单，有几个效果很酷很特别，有些也非常实用，一起来看看。 1、CSS3环形特色表单 转圈切换表单焦点 这款CSS3表单非常有特色，估计各位不太会看到过，这是一款CSS3环形特色表单，整个环形由一个个输入框组成，当用鼠标**输入框焦点时，环形圈即会转到该表单项。我们也可以用tab键来逐个选择输入框来输入表单内容。 »
display 属性规定元素应该生成的框的类型。 简单来说就是制定元素是行内元素还是块元素或者是其他元素。 display: block; display: inline; 这两个属性值只影响元素的表现，不会影响元素内部子元素的类型。 display: flex; flex属性值会指定该元素内部子元素的排列方式。 与flex配合使用的属性： align-items 1）元素顶部对齐 flex-st »
要使用标准的CSS3实现某元素的投影效果，有两个套路，第一个就是使用常见的box-shadow, 第二个就是使用CSS3的filter阴影滤镜drop-shadow，那这两个阴影实现有什么具体的差异呢？ 一、兼容性不一 CSS3 box-shadow从IE9浏览器开始就支持了，兼容性如下截图： 而filter中的drop-shadowIE13才开始支持，移动端Android4.4才开始支持，细想 »
这里文章收集了15个创意的 CSS3 文本效果，所有的都是精心挑选，这些可能会增加创意的火花到你的下一个项目。其中有些是用于特定用途，而另一些则适用于多种用途。如果你想要一个精彩而又充满色彩的文字效果，那么这是给你的完美的解决方案！它非常适合于创意机构或作品集项目。 您可能感兴趣的相关文章 小伙伴们惊呆了！8个超炫的 Web 效果 8个惊艳的 HTML5 和 JavaScript 特效 1 »
translate translate这个参数的，是transform 身上的，那么它有什么用呢？ 其实他的作用很简单，就是平移，参考自己的位置来平移 translate() translateX() translateY() translateZ() translate3d() translateX 向X轴平移，填正数往右平移，填负数，往左平移 translat »
说明：本文内容真实！！！不是推广！！！ 学习前端的同学应该都或多或少听说过 Pink 老师，我个人觉得 Pink 老师的前端视频教程应该说是目前B站上最好的了，没有之一！ Pink老师 HTML CSS B站视频课程链接 我花了整整半年的时间细致认真的学习完了 Pink 老师的 HTML CSS 教 ... »
先记录一下css3 3d练习 本例中主要使用background-image，background-attachment，background-position属性，设计二维位移的立体效果。 如图所示，移动滚动条可以使易拉罐从左向右滚动。background-image 属性会在元素的背景中设置一个图像。background-attachment 属性设置背景图像是否固定或者随着页面的其余部分滚 »
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> »
多列-column-gap列与列间隙 通用语法 定义和用法 column-gap 属性规定列之间的间隔。 注释：如果列之间设置了 column-rule，它会在间隔中间显示。 默认值： normal 继承性： no 版本： CSS3 JavaScript 语法： object.style.columnGap=“40px” 语法 column-gap: length|normal; 值 描述 len »
用css3的高级部分做一个字面上移动光斑的动态效果： 代码如下： <!doctype html><html><head><meta charset="utf-8"><title>无标题文档</title><style type="text/css">*{margin:0; »
文本阴影text-shadow .box { text-shadow: 4px 5px 5px pink; } 参数：x轴偏移 y轴偏移 模糊距离 颜色 文本换行设置white-space（如何处理元素内的空白） 正常写一段一段文本，超出部分会自动换行，默认white-space为normal .box { white-space: nowrap; } 设 »
【微信支付】分享一个失败的案例 2018-06-04 08:24 by stoneniqiu, 2744 阅读, 29 评论, 收藏, 编辑 这个项目是去年做的，开始客户还在推广，几个月后发现服务器已经关掉了。这是一个发图片猜谜语的应用，用户猜对了分红包，所得奖金可以提现。开发的时候对需求都不太看好，觉得用户粘性太低了。今天就把所有的程序拿了出来放在了github上。供有兴趣的伙伴玩耍。 产品 »
1、文本阴影属性 text-shadow:值1 值2 值3 值4； 值1 ： 水平方向的距离 （必须有的：支持负值）（向左为正值） 值2 ： 垂直方向的距离 （必须有的：支持负值）（向下为正值） 值3 ： 阴影的模糊程度 （不支持负值） 值4 ： 阴影的颜色 第一个值 和 第二个值得位置不能互换。 如：text-shadow:10px 10px 4px red; 代表文字的阴影水平方向向右移动10 »
在 频幕 居中一个元素的的最快捷的方式： div{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); } 2d 转换之旋转 1 transform:rotate() »
效果截图： HTML代码： <div class="ball-box"> <div class="ball"> <div class="line-1"></div> <div class="line-2"></div> »
此前写的那个太复杂了，来点简单的核心 <html> <head> <title></title> <style type="text/css"> * { margin: 0; padding: 0; border: none; } .Bl { »
1：align-content 属性 定义：修改 flex-wrap 属性的行为，类似 align-items, 但不是设置子元素对齐，而是设置行对齐 2：align-items 属性 定义：设置弹性盒子元素在侧轴（纵轴）方向上的对齐方式。 3：align-self 属性 定义：在弹性子元素上使用。覆盖容器的 align-items 属性。 4：justify-content 属 »
CSS3选择器 你困惑与所有新的CSS3选择器？本文提供了有益的见解和CSS3选择器的解释。 用CSS3和RGBA实现的超棒按钮 你不会相信这些按钮只使用CSS3属性，而不是通过任何图像创建。 使用CSS3渲染用户界面 下面是用CSS3的创作案例。 使用CSS3的OSX用户界面。 CSS3模板布局与jQuery插件 这个插件允许Web设计人员使用jQuery使用W3的CSS模板布局模块。 »
1末页