-
css3原来还有这些功能查看全部
-
transition:all 2s 表示所有的属性都将参与动画查看全部
-
Html5语义化标签 figure标签 用于规定独立的流内容(图像、图表、照片、代码等) figcaption标签 与figure配套使用,用于标签定义figure元素的标题 例: <figure> <img alt="" src=""> <figcaption></figcaption> </figure> CSS3属性 transform以及transition transform为css3属性,主要用于元素的变形处理 属性:translate(平移),rotate(旋转),scale(缩放),skew(斜切)查看全部
-
transform的四种基本属性:平移,旋转,扭曲,缩放查看全部
-
transform:translate 是相对于当前自己的位置定位的查看全部
-
p:nth_of_type(1){transition-delay:0.05s} p:nth_of_type(2){transition-delay:0.05s} p 标签同级的兄弟元素查看全部
-
figure:figcaption{h5新增标签:规定独立内容提高图片识别效率,配套使用查看全部
-
父容器中有相对定位时,子容器中的绝对定位就根据父容器查看全部
-
@media screen and (min-width: 1001px){ figure{width: 33.3%;} } @media screen and (max-width: 600px){ figure{width:100%;} } @media screen and (min-width:600px) and (max-width: 1000px){ figure{width:50%;} }查看全部
-
opacity:0.8; 透明度 <link rel="stylesheet" type="text/css" href="styleA.css" media="screen and (min-width: 400px)"> 当屏幕的宽度大于等于400px的时候,应用styleA.css 在media属性里: screen 是媒体类型里的一种,CSS2.1定义了10种媒体类型 and 被称为关键字,其他关键字还包括 not(排除某种设备),only(限定某种设备) <link rel="stylesheet" type="text/css" href="styleB.css" media="screen and (min-width: 600px) and (max-width: 800px)"> 当屏幕的宽度大于600小于800时,应用styleB.css @media screen and (max-width: 600px) { /*当屏幕尺寸小于600px时,应用下面的CSS样式*/ .class {background: #ccc; } } -moz-transition: width 2s; /* Firefox 4 */ -webkit-transition: width 2s; /* Safari 和 Chrome */ -o-transition: width 2s; /* Opera */查看全部
-
媒体查询可以备用在css中的@media 和@import 规则上 @media sreen and (width:800px){ 样式 } @import url(example.css) screen and (width:800px) <link media="screen and (width:800px)" rel="stylesheet" href="example.css" />0查看全部
-
transform:all 2s ease-in 1s; transform:translate(xpx,ypx)平移//all所有指定元素 2s 过渡动画时间 ease-in/ease out 慢速开始,然后变快 /慢速结束的过渡效果 1s 推迟多久才执行 transform:width 2s ease-in 1s; //指定宽度查看全部
-
transition过度动画处理 ie6-9 不支持 property:检索或设定对象中的参与过渡的属性 duration 过渡动画时间 delay 检索或设置对象延迟过渡的时间 timing-function 检索或设置对象中过渡的动画类型(linear ease ease-in ease-out ease-in-out)查看全部
-
translate 指定对象的2dtranslation 第一个x轴 第二个y轴 第二个参数未提供则默认0 例如 transform:translate(10px,10px); 平移 rotate 旋转 需要选有transform-origin属性的定义 (设定元素的中心点) rotate(90deg) ,transform-origin:0 0; scale 缩放 transform:scale(1.3,1.3);/*缩放 无单位*/ skew 斜切 transform:skew(10deg,2deg);/*斜切 单位deg*/ transform-origin:0 0; /*旋转中心点 定义 00 左上角*/ transform:rotate(0deg); /*旋转*/ transform:translate(10px,100px;); /*平移*/ transform:scale(1.3,1.3);/*缩放 无单位*/ transition: transform 3s;查看全部
-
transform transition transform css3属性 主要用于元素变形处理 属性:translate 平移 rotate 旋转 scale 缩放 skew 斜切 兼容性 ie6-8 不兼容查看全部
举报
0/150
提交
取消