一些关于CSS和JS的Demo实现
CSS
一些Codepen Demo效果,及常见的CSS布局解决方案
- CSS 一个简单的Pop Model效果
- 返回顶部按钮效果
- 一个元素不同方案实现边框效果
- 一个元素实现button
- 用表格画一个CSS Calendar
- CSS Counter 计数器
- CSS Holy Grail Layout 圣杯布局
- 移动端水平滑动导航条
- 容器内等比例分配正方形
text-align:justify
实现步骤列- CSS 流式布局
- 用一个元素画三角形
- 左右两栏布局,左边固定宽度,右边自适应
- 简单的CSS3 Box-Layout 弹性盒模型布局
- CSS3 画网格线
- 让一个不定宽高元素水平垂直居中
- 多种方案实现不定宽高元素水平垂直都居中
- 多种方案实现定宽高元素水平垂直都居中
- 饭否十周年生日蛋糕
- 一个hover动画的Button
- 多种方案实现跨栏或跨列布局
- 一个简单的Login Model登陆模态框
- 多种方案实现在规定容器内等比例排列元素
- 不定宽高实现等比例正方形排列
- 一个元素实现的效果
- RGBA和Opacity的区别
- Preloader Loading进度效果
- Spinner Loading进度效果
- CSS 实现iPhone Switch 开关按钮
- CSS3 Text-Shadow 实现字体集效果
- text-transform 属性
- 多行文本水平垂直居中效果
- 多种方案实现两栏布局,左侧固定列,右侧自适应
- 常见的网站页面结构
- 粘性页脚(页脚始终保持在底部)01
- 粘性页脚(页脚始终保持在底部)02
- 粘性页脚(页脚始终保持在底部)03
- 粘性页脚(页脚始终保持在底部)04