div常用效果方法-transform
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
div:first-of-type{
width: 200px;
height: 200px;
background: #006400;
/*使 div 元素看上去像一个按钮:*/
appearance: button;
/*background-attachemnt: 背景定位*/
/*取值: scroll | fixed | inherit
scroll: 随着页面的滚动轴背景图片将移动
fixed: 随着页面的滚动轴背景图片不会移动
inherit: 继承*/
background-attachment: scroll;
border: 10px black dashed;
/*背景填充方法*/
background-clip: padding-box;
/*阴影方法*/
/*内阴影 inset*/
box-shadow: 10px 10px 10px black inset;
text-shadow: 10px 10px 10px red;
/*偏移方法*/
/*旋转方法*/
transform: rotate(30deg);
/*移动位置 左右 上下*/
transform: translate(100px,100px);
/*规模效果*/
transform: scale(2);
/*变形效果*/
transform:skew(20deg);
/*变化持续时间*/
transition: 5s;
}
div{
width: 200px;
height: 200px;
background: linear-gradient(#f4f4f4,#000000);
transition: 5s;
/*行类块标签*/
display: inline-block;
}
div:hover{
transform: rotateX(45deg) translate(100px,100px) scale(2) skew(45deg);
}
</style>
</head>
<body>
<div>道可道,非常道</div>
<div>道可道,非常道</div>
<div>道可道,非常道</div>
</body>
</html>
div常用效果方法-transform的更多相关文章
- iOS项目常用效果方法注意点集锦
移动中隐藏tabBar,静止显示tabbar - (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView { // 隐藏tabbar ...
- CSS3 3D立方体效果-transform也不过如此
CSS3系列已经学习了一段时间了,第一篇文章写了一些css3的奇技淫巧,原文戳这里,还获得了较多网友的支持,在此谢过各位,你们的支持是我写文章最大的动力^_^. 那么这一篇文章呢,主要是通过一个3D立 ...
- jQuery常用属性方法大全 attr(),val()
@@@@属性篇: 写作本篇文章的意义:jQuery的教程千千万,却没有英文版的API讲的系统.到位,一些话用中文翻译过来味道就变了,所以我将英文版的API的一些常用的方法单独提出来放在这里,并用自己的 ...
- jQuery 常用核心方法
jQuery 常用核心方法 .each() 遍历一个jQuery对象,为每个匹配元素执行一个函数 $('p').each(function(idx,node){ $(node).text(idx + ...
- 【Puppeteer】puppeteer安装/常用的方法以及一个小栗子(Youtube油管自动评论)
这里介绍的是Win平台的安装方法,其他平台请至Github>Puppeteer. 首先要安装node.js 可以看我这篇的开头>[Angular]学习笔记-环境部署.项目建立相关 1.新建 ...
- JOptionPane类提示框的一些常用的方法
JOptionPane类提示框的一些常用的方法 XMLOracleSwing 最近在做swing程序中遇到使用消息提示框的,JOptionPane类其中封装了很多的方法. 很方便的,于是就简单的整理了 ...
- 常用js方法
function dateGetter(name, size, offset, trim) { offset = offset || 0; return function (date) { var v ...
- jQuery操作Table tr td常用的方法
虽然现在DIV+CSS进行页的布局大行其道,但是很多地方使用table还是有很多优势,用table展示数据是比较方便的,下面汇总了jQuery操作Table tr td常用的方法,熟记这些操作技巧,下 ...
- iOS常用公共方法
iOS常用公共方法 字数2917 阅读3070 评论45 喜欢236 1. 获取磁盘总空间大小 //磁盘总空间 + (CGFloat)diskOfAllSizeMBytes{ CGFloat si ...
随机推荐
- 洛谷 P4379 [USACO18OPEN]Lemonade Line
P4379 [USACO18OPEN]Lemonade Line 题目描述 这是农场上一个炎热的夏日,Farmer John要给他的 NN 头奶牛发柠檬汽水了!所有的 NN 头奶牛(方便起见,编号为 ...
- 思科CISCO 交换机命名规则
思科交换机的命名规则要比路由的命名规则复杂, 看下这些:WS-C2960-24TC-L .WS-C2950G-24-EI-DC .WS-C2960-24TT-L .WS-C3750G-24TS-E ...
- oracle11g expdp/impdp数据库
oracle11g导入/导出数据库 导出 .创建目录 sqlplus / as sysdba create directory dbDir as 'd:\oralce_sdic_backup\'; g ...
- DELPHI异步选择模型UDP
unit U_FrmServer; interface uses Windows, Messages, SysUtils, Classes, Graphics, Controls, Forms, Di ...
- [转] ASPNET Core 中获取应用程序物理路径
如果要得到传统的ASP.Net应用程序中的相对路径或虚拟路径对应的服务器物理路径,只需要使用使用Server.MapPath()方法来取得Asp.Net根目录的物理路径,如下所示: // Classi ...
- 当遇到Mac的Excel或者Word老是重复崩溃的时候
打开Number,新建文件然后导出为Excel.之后再用Excel打开,一切都OK了.
- Django学习系列之Cookie、Session
Cookie和Session介绍 cookie 保存在客户端 session 保存在服务端 session依赖于cookie,比如服务端想往客户端写东西的时候就把cookie写到客户端浏览器 djan ...
- 015 WAN
Router#config t Enter configuration commands, one per line. End with CNTL/Z. Router(config)#int s0/ ...
- 菜鸟学python-基础(2)
变量命名: 1)必须以字符或下划线开头 2)以单下划线开头(_fo)表示不能直接訪问的类属性,须要类提供的接口进行訪问 3)以双下划线开头(__foo)的代表类的私有成员 4)以双下划线开头(__fo ...
- 设计并实现一个LRU Cache
一.什么是Cache 1 概念 Cache,即高速缓存,是介于CPU和内存之间的高速小容量存储器.在金字塔式存储体系中它位于自顶向下的第二层,仅次于CPU寄存器.其容量远小于内存,但速度却可以接近CP ...