随笔分类 -  CSS

CSS学习路程
CSS实现进度条
摘要：进度条经常运用于网页，即使我们意识到不是所有的东西都将瞬间被加载完成，这些进度条用于提醒使用者关于网页上具体的任务进程，譬如上传，下载，加载应用程序等。 以前如果想要创建一个进度条的动画效果，没有使用JavaScript是不可能实现的。然而感谢CSS3的出现，我们现在能够在div里执行动画，添加梯度 阅读全文
posted @ 2018-01-30 10:16 流行浪子 阅读(8750) 评论(0) 推荐(0)
H5案例分享：移动端滑屏 touch事件
摘要：移动端滑屏 touch事件 移动端触屏滑动的效果的效果在电子设备上已经被应用的越来越广泛，类似于PC端的图片轮播，但是在移动设备上，要实现这种轮播的效果，就需要用到核心的touch事件。处理touch事件能跟踪到屏幕滑动的每根手指。 以下是四种touch事件 touchstart: //触摸屏幕时触 阅读全文
posted @ 2017-12-11 14:24 流行浪子 阅读(1983) 评论(0) 推荐(0)
HTML5 元素拖动 - 实现元素左右拖动， 或更改自身排序
摘要：1、拖放（Drag 和 drop）是 HTML5 标准的组成部分。 拖放是一种常见的特性，即抓取对象以后拖到另一个位置。在 HTML5 中，拖放是标准的一部分，任何元素都能够拖放。 浏览器支持：Internet Explorer 9、Firefox、Opera 12、Chrome 以及 Safari 阅读全文
posted @ 2017-09-21 19:27 流行浪子 阅读(1411) 评论(0) 推荐(0)
CSS Why
摘要：前面的话 在CSS学习目录中，已经详细地介绍了CSS如何使用。知其然，还要知其所以然。本文将介绍CSS各部分出现的原因，仅限个人理解，如有不妥，欢迎交流 Why CSS 早期的大多数网站标记几乎完全由表格和font元素组成，且对于所要表现的内容不能传达任何实际含义，使文档可用性降低，且不易于维护。于 阅读全文
posted @ 2017-06-26 16:29 流行浪子 阅读(294) 评论(0) 推荐(0)
CSS3新属性之---flex box布局实例
摘要：flex box布局实例 flex的强大之处在于不管什么布局，几行命令即可实现 /*本节模板div元素（代表骰子的一个面）是Flex容器，span元素（代表一个点）是Flex项目。如果有多个项目，就要添加多个span元素，以此类推。*/ <div class="box"> <span class=" 阅读全文
posted @ 2017-04-01 14:50 流行浪子 阅读(490) 评论(0) 推荐(0)
史上最全Html和CSS布局技巧
摘要：单列布局水平居中 水平居中的页面布局中最为常见的一种布局形式，多出现于标题，以及内容区域的组织形式，下面介绍四种实现水平居中的方法（注：下面各个实例中实现的是child元素的对齐操作，child元素的父容器是parent元素） 使用inline-block 和 text-align实现 .paren 阅读全文
posted @ 2017-04-01 14:45 流行浪子 阅读(2245) 评论(0) 推荐(0)
windows下安装sass，以及常见错误和解决办法
摘要：简介： sass依赖于ruby环境，安装sass之前得先装ruby。 简介： sass依赖于ruby环境，安装sass之前得先装ruby。 1、安装ruby 1.1、下载地址：http://rubyinstaller.org/downloads 1.2、注意事项：安装时，最好勾选Add Ruby e 阅读全文
posted @ 2017-03-31 11:35 流行浪子 阅读(519) 评论(0) 推荐(0)