css3
AsaZyf
这个作者很懒,什么都没留下…
展开
-
HTML5+CSS3期末考试大题
1.制作一个文件上传效果code:<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>file</title> <style> .content{ w原创 2019-01-08 21:24:01 · 16620 阅读 · 0 评论 -
CSS3--animation属性(fill-mode)
图片链接见https://blog.csdn.net/AsaZyf/article/details/83831462code:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>animation-fill-mode<原创 2018-11-08 11:29:42 · 426 阅读 · 0 评论 -
CSS3--animation属性(direction)
图片链接见https://blog.csdn.net/AsaZyf/article/details/83831462code:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>animation-direction<原创 2018-11-08 11:27:53 · 447 阅读 · 0 评论 -
CSS3--animation属性(delay和iteration-count)
delay:iteration-count:图片链接见https://blog.csdn.net/AsaZyf/article/details/83831462code:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title&g原创 2018-11-08 10:48:37 · 777 阅读 · 0 评论 -
CSS3多列
定义:参数:code:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>columns</title><style type="text/css"&原创 2018-11-13 14:29:42 · 150 阅读 · 0 评论 -
CSS3动画--animation属性(name和duration)
animation-name:animation-duration:code:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>animation-duration</title>&原创 2018-11-07 20:45:53 · 1330 阅读 · 0 评论 -
CSS3动画--@keyframes
定义:语法和参数:code:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>@KeyFrames</title><style type="text/css"原创 2018-11-12 21:44:03 · 369 阅读 · 0 评论 -
CSS3--transition简写
code:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> * { margin: 0; padding: 0; } div原创 2018-11-07 10:24:56 · 2673 阅读 · 0 评论 -
CSS3--transform与坐标系统
explain:(默认以中心为转换点)code:原创 2018-11-04 15:47:44 · 2101 阅读 · 0 评论 -
CSS3多列属性--column-gap
code:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>column-gap</title><style type="text/css">body原创 2018-11-13 20:25:48 · 343 阅读 · 0 评论 -
CSS3多列属性--column-rule
code:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>column-rule</title><style type="text/css">body原创 2018-11-13 20:31:31 · 281 阅读 · 0 评论 -
CSS3--animation(play-state)
code:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>animation-play-state</title><style type="text/css"&原创 2018-11-08 16:15:03 · 344 阅读 · 0 评论 -
CSS--样式重置
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, ...原创 2018-11-28 20:45:19 · 193 阅读 · 0 评论 -
CSS3用户界面--pointer-events
code:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>pointer-events</title><style type="text/css">.原创 2018-11-17 11:51:07 · 184 阅读 · 0 评论 -
CSS3用户界面--user-select
code:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>user-select</title><style type="text/css">div原创 2018-11-17 11:49:26 · 243 阅读 · 0 评论 -
CSS3用户界面--resize
code:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>resize</title><style type="text/css">div { wid原创 2018-11-17 11:43:13 · 169 阅读 · 0 评论 -
CSS3用户界面--cursor
code:<!DOCTYPE html><html lang="zh-cmn-Hans"><head><meta charset="utf-8" /><title>cursor</title><style>.test { width: 400px; bo原创 2018-11-15 11:53:15 · 282 阅读 · 0 评论 -
flex实际应用-- flex-card布局
code:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"&原创 2018-11-20 16:36:43 · 820 阅读 · 0 评论 -
CSS3--column-span
code:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>column-span</title><style type="text/css">body原创 2018-11-14 20:09:12 · 325 阅读 · 0 评论 -
CSS3--animation属性复合
code:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Animation</title><style type="text/css">body {原创 2018-11-08 16:20:02 · 1884 阅读 · 0 评论 -
CSS3 3D转换--rotate
rotateX:rotateY:transform:rotateY(angle)rotateZ:rotate3d:注意点:当x,y,z数值为0或小于0时无效果原创 2018-11-04 12:00:27 · 222 阅读 · 0 评论 -
CSS3 2D转换--扭曲skew
三种情况:skewX:skew(X)注意点:skew(Y):transform:skewY(angle)skew(X,Y):skew(X,Y)注意点:当只写一个值时,默认y值为0原创 2018-11-04 11:35:53 · 388 阅读 · 0 评论 -
CSS3 2D转换--缩放scale
缩放scale三种情况:scaleX:scaleY:scale(x,y):原创 2018-11-04 11:13:29 · 388 阅读 · 0 评论 -
CSS3---永动的方块
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> @-webkit-keyframes domove{原创 2018-10-17 16:17:22 · 281 阅读 · 0 评论 -
jquery、CSS3----多个导航条下拉
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>CSS3实现导航条下拉效果</title> <style> * {原创 2018-10-17 15:57:53 · 229 阅读 · 0 评论 -
CSS3--小三角形箭头
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> #sider{ width:原创 2018-10-16 17:23:48 · 595 阅读 · 0 评论 -
CSS3-利用after清浮动
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> .header{ width:原创 2018-10-08 22:02:56 · 1514 阅读 · 0 评论 -
CSS3-radio实现选项卡切换
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>radio实现选项卡切换</title> <style> *{原创 2018-10-08 22:00:49 · 1011 阅读 · 0 评论 -
CSS3-对话框图形
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>after和before生成小三角</title> <style> body{原创 2018-10-08 21:59:22 · 455 阅读 · 0 评论 -
CSS3----旋转图片
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>旋转图片</title> <style> *{ margin:原创 2018-10-15 16:21:30 · 516 阅读 · 0 评论 -
CSS3--底部菜单上拉效果
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>底部菜单上拉效果</title> <style> *{ marg原创 2018-10-15 16:13:21 · 2988 阅读 · 1 评论 -
CSS3--永动圆形
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> @-webkit-keyframes move{原创 2018-10-17 16:30:31 · 221 阅读 · 0 评论 -
CSS3----无缝滚动
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> @-webkit-keyframes domove{原创 2018-10-17 16:36:28 · 194 阅读 · 0 评论 -
CSS3选择器selection--改变选中文字的颜色
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <style> p::selection{ background: blue; color: red; }原创 2018-10-29 15:25:13 · 1181 阅读 · 0 评论 -
CSS3 2D转换--旋转rotate
explain:code:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>rotate</title><style type="text/css">原创 2018-11-04 00:27:06 · 621 阅读 · 0 评论 -
CSS3 2D转换--移动translate
explain:code:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>translate(x,y)</title><style type="text/css"原创 2018-11-04 00:18:47 · 340 阅读 · 0 评论 -
CSS3字体--使用【有字库】字体
code:<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript" src="http://cdn.webfon原创 2018-11-01 23:16:29 · 749 阅读 · 0 评论 -
CSS3字体--获取特殊字体
网站链接,可以通过上传一种格式的字体获取多种格式的字体操作步骤:勾选的格式:原创 2018-11-01 22:52:38 · 299 阅读 · 0 评论 -
CSS3字体--字体的应用
通用模板【兼顾IE和手机】使用:原创 2018-11-01 22:37:32 · 313 阅读 · 0 评论 -
CSS3字体--取值说明和格式
取值说明:格式:①②③④IE专用⑤前端流行原创 2018-11-01 22:10:57 · 339 阅读 · 0 评论