CSS
关注
分享
扫一扫
Vivian_shuang
Be a IT engineer！
展开
-
100度
DOCTYPE html>html lang="en">head>meta charset="UTF-8">title>100度title>style>.father{width:914px;margin:0 auto;}.top{width:914px;height:30px;background-color:#E9E9E9;原创 2016-07-12 08:16:15 · 559 阅读 · 0 评论 -
3d魔方
DOCTYPE html>html lang="en">head>meta charset="UTF-8">title>Documenttitle>style>html,body{height:100%;}body{perspective:1000px;-webkit-transform-style:preserve-3d;原创 2016-07-07 08:15:07 · 465 阅读 · 0 评论 -
数字变换
DOCTYPE html>html lang="en">head>meta charset="UTF-8">title>Documenttitle>style>html,body{height:100%;}body{perspective:1000px;-webkit-transform-style:preserve-3d;原创 2016-07-07 08:32:57 · 440 阅读 · 0 评论 -
border-radius画企鹅
DOCTYPE html>html lang="en">head>meta charset="UTF-8">title>Documenttitle>style>.father{position:fixed;top:50px;left:200px;}.head{width:400px;height:300px;borde原创 2016-07-07 08:34:01 · 502 阅读 · 0 评论 -
动画小例子
DOCTYPE html>html lang="en">head>meta charset="UTF-8"> -->title>Documenttitle>link rel="stylesheet" href="animate.css">style>/* dian */@-webkit-keyframes move0{from{webkit-原创 2016-07-07 08:35:24 · 329 阅读 · 0 评论 -
旅游小例子
DOCTYPE html>html>head>metacharset="UTF-8">metaname="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>title>title>linkrel=原创 2016-07-07 08:36:28 · 387 阅读 · 0 评论 -
100度小例子
DOCTYPE html>html lang="en">head>meta charset="UTF-8">title>精灵图title>link rel="stylesheet" href="css/reset.css">style>.father{width:980px;margin:0 auto;}p{padding:0;原创 2016-07-07 08:38:05 · 764 阅读 · 0 评论 -
css命名规则
（1）、CSS文件命名规范全局样式：global.css框架布局：layout.css字体样式：font.css链接样式：link.css打印样式：print.css主要的：master.css专栏：columns.css主题：themes.css（2）、CSS样式命名规范容器：原创 2016-07-07 08:39:27 · 271 阅读 · 0 评论 -
冰艺小例子1
DOCTYPE html>html>head>metacharset="UTF-8">metaname="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">linkrel="stylesheet" href="css/an原创 2016-07-07 08:46:01 · 629 阅读 · 0 评论 -
冰艺小例子2
DOCTYPE html>html>head>metacharset="UTF-8">metaname="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">title>title>linkrel="stylesheet"原创 2016-07-07 08:47:01 · 328 阅读 · 0 评论 -
如家小例子
DOCTYPE html>html lang="en">head>meta charset="UTF-8">meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">title>Documenttitle>lin原创 2016-07-07 08:13:24 · 766 阅读 · 0 评论 -
掌恒小例子
DOCTYPE html>html lang="en">head>meta charset="UTF-8">title>D掌恒作品列表title>link rel="stylesheet" href="css/reset.css">style type="text/css">body{height:9999px;}a{text原创 2016-07-07 08:09:38 · 312 阅读 · 0 评论 -
格子布局
DOCTYPE html>html lang="en">head>meta charset="UTF-8">title>格子布局title>style>.father{border:10px solid white;width:500px;height:600px;float:left;font-size:40px;text-al原创 2016-07-06 22:13:42 · 480 阅读 · 0 评论 -
盒子嵌套
DOCTYPE html>html lang="en">head>meta charset="UTF-8">title>Documenttitle>style>#box1{width:50px;height:50px;background:#7FFF59;display:inline-block;border:5pxsolid #FFFD原创 2016-07-06 22:09:46 · 3201 阅读 · 0 评论 -
css总结
DOCTYPE html>html lang="en">head>meta charset="UTF-8">title>Documenttitle>head>body> --> 如果不写：ie6-8下，会出现怪异盒模型怪异盒模型：元素的大小变成：content+margin标准盒模型：元素大小：content+border+padding+margin原创 2016-07-06 22:17:06 · 273 阅读 · 0 评论 -
transform2d
DOCTYPE html>html lang="en">head>meta charset="UTF-8">title>Documenttitle>style>*{margin:0;padding:0;}html,body{width:100%;}div{width:200px;height:200px;backg原创 2016-07-06 22:19:32 · 312 阅读 · 0 评论 -
transform3d
DOCTYPE html>html lang="en">head>meta charset="UTF-8">title>Documenttitle>style type="text/css">html,body{height:100%;}body{/*透视点*//*设置一个位置观察运动*//* 放在父级*/perspective:10原创 2016-07-06 22:21:00 · 458 阅读 · 0 评论 -
3d小例子
DOCTYPE html>html lang="en">head>meta charset="UTF-8">title>Documenttitle>style>html,body{height:100%;}body{perspective:1000px;-webkit-transform-style:preserve-3d;原创 2016-07-06 22:22:08 · 359 阅读 · 0 评论 -
动画
倒影：-webkit-box-reflect:right10px -webkit-linear-gradient(top,rgba(0,0,0,0.2)20%,rgba(0,0,0,0.6));text-shadow：text-shadow:-5px-5px 5px purple,00 5px purple,00 10px red,05px 10px purple,原创 2016-07-06 22:23:42 · 329 阅读 · 0 评论 -
弹性布局小例子
DOCTYPE html>html>head>metacharset="UTF-8">title>title>style>*{margin:0;padding:0;}html,body,.wrap{height:100%;}.wrap{width:100%;height:100%; display:-webki原创 2016-07-06 22:28:42 · 823 阅读 · 0 评论 -
映纷视觉小例子
DOCTYPE html>html lang="en">head>meta charset="UTF-8">meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">link rel="stylesheet"原创 2016-07-06 22:31:02 · 2617 阅读 · 0 评论 -
冰艺小例子3
DOCTYPE html>html>head>metacharset="UTF-8">metaname="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">title>title>linkrel="stylesheet"原创 2016-07-07 08:48:23 · 1028 阅读 · 0 评论