CSS3
关注
分享
扫一扫
sleepwalker_1992
这个作者很懒，什么都没留下…
展开
-
CSS3盒子相关样式
盒子的类型，使用display属性来定义盒的类型，总体来说，CSS中的盒子分为block类型与inline类型。display:inline;display:block;display:inline-block; 可以设置宽display:把div变成了列表对盒子中容纳不下的内容的显示，可以使用overflow属性来指定对盒子中容纳不下的内容的显示方法。overf...原创 2018-05-12 19:54:15 · 999 阅读 · 0 评论 -
CSS3——弹性布局
网页布局（layout）是CSS的一个重点应用。布局的传统解决方案，基于盒状模型，依赖 display属性 + position属性 + float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现。2009年，W3C提出了一种新的方案—-Flex布局，可以简便、完整、响应式地实现各种页面布局。目前，它已经得到了所有浏览器的支持，这意味着，现在就能很安全地使用这项功能。Flex布局将成...转载 2018-07-03 11:42:11 · 3144 阅读 · 0 评论 -
CSS 透明度设置方法及常见问题解析
怎样在CSS样式中设置背景的透明度看看下面的CSS： img { opacity:0.4; filter:alpha(opacity=40); /* For IE8 and earlier */ }IE9，Firefox，Chrome，Opera，和Safari浏览器使用透明度属性可以将图像变的不透明。 Opacity属性值从0.0 - 1.0。值越小，使得元素更加透明。IE8和早期版本使用滤镜：...转载 2018-06-19 17:37:44 · 2533 阅读 · 0 评论 -
CSS3——border-radius
1、画圆利用border-radius: 50%;<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>circle</title> <style>原创 2018-05-29 23:05:42 · 140 阅读 · 0 评论 -
CSS3——box-shadow
box-shadow 属性向框添加一个或多个阴影。默认值：none继承性：noJavaScript 语法：object.style.boxShadow="10px 10px 5px #888888"语法box-shadow: h-shadow v-shadow blur spread color inset;注释：box-shadow 向框添加一个或多个阴影。该属性是由逗号分隔的阴影列表，每个阴影...原创 2018-06-03 21:39:01 · 271 阅读 · 0 评论 -
CSS3 中的动画功能——transition和animation
在 CSS3 中，如果使用动画功能，可以使页面上的文字货画像具有动画效果，可以使用背景色从一种颜色平滑过渡到另一种颜色。在元素上添加上动画效果之后，可以使元素更具有客观性。 Transitions 功能，在 CSS3 中，Transitions 功能通过将元素的某一个属性从一个属性值指定的时间内平滑过渡到另外一个属性值来实现动画功能。 Animations 功能，Animations 功能与 Tr...原创 2018-05-12 20:16:50 · 382 阅读 · 0 评论 -
CSS3 文字与字体相关样式
CSS3 给文字添加阴影，使用 text-shadow 属性给页面上的文字添加阴影效果，text-shadow 属性是在CSS2中定义的，在 CSS2.1 中删除了，在 CSS3 的 text 模块中又恢复了。第一个参数横向偏移量，如果是正数向右偏移量，如果是负数向左偏移量，第二个参数纵向偏移量，如果是正数向下偏移量，如果是负数向上偏移量，第三个参数透明度即模糊程度可以设置多个阴影 CSS3 使...原创 2018-05-12 19:54:04 · 943 阅读 · 0 评论 -
CSS3——属性选择器
CSS3 属性选择器 CSS3 属性选择器，在 CSS3 中，追加了三个属性选择器分别为：[att*=val]、[att^=val]和[att$=val]，使得属性选择器有了通配符的概念。[att*=val]表示包含。CSS3 结构性伪类选择器，包含伪类选择器和伪元素选择器，在伪元素选择器中包含 first-line（给元素内容第一行增加属性）、first-letter（给元素内容首字母增加属性）...原创 2018-05-12 19:53:44 · 14334 阅读 · 1 评论 -
CSS3 中的变形处理——transform
transform 功能的基础知识，可以利用 transform 功能来实现文字或者图像的旋转，缩放，倾斜和移动这四种类型的变形处理。对一个元素使用多种变形的方法，而且在一个元素中可以同时添加多个变形处理，是元素有更好的表现效果。顺序不一样，结果不一样指定变相的基准点，在使用 transform 方法进行文字或图像的变形时，是以元素的中心点为基准点进行的。此时可以通过 transform-orig...原创 2018-05-12 19:50:20 · 394 阅读 · 0 评论 -
CSS3背景与边框样式
与背景相关的新增属性，包含background-clip.background-origin.background-size。圆角边框，圆角边框的绘制也是Web网站或Web应用程序中经常用来美化页面效果的手法之一。使用图像边框，，在CSS3中，增加了border-image属性，可以让元素的长度或宽度处于随时变化状态的边框统一使用一个图像文件来进行绘制。...原创 2018-05-12 19:54:25 · 684 阅读 · 0 评论 -
CSS3——flex弹性布局
容器的属性以下6个属性设置在容器上，就是说给flex container添加这些属性，来布局flex item。flex-directionflex-wrapflex-flowjustify-contentalign-itemsalign-contentflex-direction属性：决定主轴的方向（即项目的排列方向）。属性值：row（默认值）：主轴为水平方向，起点在左端。row-reverse...原创 2018-07-03 17:12:47 · 393 阅读 · 1 评论