2020年4月13日
css 利用animation和transform 设置复仇者魔方
摘要： 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <style> 7 8 html{ 9 perspective: 800px; 10 } 11 12 @keyframes round{ 阅读全文
posted @ 2020-04-13 14:31 全情海洋 阅读(209) 评论(1) 推荐(0) 编辑
css 利用animation和transform 设置鸭子表
摘要： 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>表</title> 6 <style> 7 8 9 /* 设置关键帧 */ 10 @keyframes clock{ 11 from{ 12 transform 阅读全文
posted @ 2020-04-13 11:55 全情海洋 阅读(360) 评论(0) 推荐(0) 编辑
2020年4月11日
码云非活跃帐号处理规范
摘要： 码云非活跃帐号处理规范 https://gitee.com/login 《码云非活跃帐号处理规范》 码云帐号的个人空间地址即 URL 标识（下面简称标识，如 https://gitee.com/xxxx 中的 xxxx) 在整个系统内是唯一的，以先到先得的方式提供给用户使用，对以下两种情况，码云保留 阅读全文
posted @ 2020-04-11 21:15 全情海洋 阅读(483) 评论(0) 推荐(0) 编辑
css 表格
摘要： 1. 在现实生活中，我们经常需要使用表格来表示一些格式化数据： 课程表、人名单、成绩单.... 同样在网页中我们也需要使用表格，我们通过table标签来创建一个表格2.<table border="1" width='50%' align="center"> <!-- 在table中使用tr表示表格 阅读全文
posted @ 2020-04-11 20:28 全情海洋 阅读(266) 评论(0) 推荐(0) 编辑
css 背景图片
摘要： 1.background-image 设置背景图片 - 可以同时设置背景图片和背景颜色，这样背景颜色将会成为图片的背景色 - 如果背景的图片小于元素，则背景图片会自动在元素中平铺将元素铺满 - 如果背景的图片大于元素，将会一个部分背景无法完全显示 - 如果背景图片和元素一样大，则会直接正常显示 2. 阅读全文
posted @ 2020-04-11 20:21 全情海洋 阅读(618) 评论(0) 推荐(0) 编辑
css 利用transform 实现页面居中效果
摘要： 1.代码 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <style> 7 *{ 8 margin: 0; 9 padding: 0; 10 } 11 12 div{ 13 /* wi 阅读全文
posted @ 2020-04-11 20:05 全情海洋 阅读(2672) 评论(0) 推荐(0) 编辑
css 变形（transform）
摘要： 1.transform 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>变形</title> 6 <style> 7 8 .box1{ 9 width: 200px; 10 height: 200px; 11 阅读全文
posted @ 2020-04-11 19:52 全情海洋 阅读(596) 评论(0) 推荐(0) 编辑
css 的过渡（transition） 和动画（animation）
摘要： 1.transition 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <style> 7 .box1{ 8 position: absolute; 9 width: 200px; 1 阅读全文
posted @ 2020-04-11 19:49 全情海洋 阅读(840) 评论(0) 推荐(0) 编辑
利用平移（transform），设置元素浮动效果
摘要： 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>变形</title> 6 <style> 7 8 .box1{ 9 width: 200px; 10 height: 200px; 11 margin-top: 阅读全文
posted @ 2020-04-11 15:12 全情海洋 阅读(719) 评论(0) 推荐(0) 编辑
利用雪碧图，完成兔子走路过渡/动画效果
摘要： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style> /* 像这种，利用雪碧图制作的动画效果叫做精灵动画 */ .box1{ height: 271px; width: 132px; backgrou 阅读全文
posted @ 2020-04-11 11:01 全情海洋 阅读(1390) 评论(0) 推荐(0) 编辑