border-radius:CSS3圆角   语法:border-radius:25px;     椭圆边角:语法-border-radius:xx%;或者15px/100px;

box-shadow:CSS3盒阴影     语法:box-shadow:5px 5px 10px #eee;

border-image:使用图像创建一个边框     语法:boder-image:url(xx.xxx) 30 30 round     round是平铺、stretch是拉伸

background-size:自定义设置背景图片的大小     语法:background-size:--px  --px;     背景图片完全填充background-size:100% 100%;

background-origin:指定了背景图像的位置区域     border-box     padding-box     content-box

CSS3允许多个背景图片:background-image:url(img_flwr.gif),url(img_tree.gif);

CSS3渐变

linear-gradients:线性渐变     语法:background: linear-gradient(to right, red,orange,yellow,green,blue,indigo,violet);

使用透明度transparency    语法:linear-gradients(to right,rgb(255,0,0,0),rgb(255,0,0,1));

为了添加透明度,我们使用 rgba() 函数来定义颜色结点。rgba() 函数中的最后一个参数可以是从 0 到 1 的值,它定义了颜色的透明度:0 表示完全透明,1 表示完全不透明。

radial-gradients:径向渐变     语法与linear-gradients一样,这里不重复。

text-shadow:文本阴影     语法:text-shadow:--px --px --px #eee;

word-wrap:break-word如果某个单词过长溢出文本框,此标签强制换行

CSS3的几个标签速记1的更多相关文章

  1. CSS3的几个标签速记3

    transition:CSS3过渡     css3里很好的一个标签,可以非常方便的完成需要很多JS才能完成的动态效果 例语法:transition:width 2S,height 2S,transf ...

  2. 12种炫酷HTML5 SVG和CSS3表单浮动标签特效

    这是一组效果非常炫酷的HTML5 SVG和CSS3表单浮动标签特效.这组浮动标签特效共12种效果,使用SVG和CSS3来制作完成.这些浮动标签效果部分在元素的伪元素上使用CSS transitions ...

  3. CSS3之尖角标签

    如图所示,Tag标签的制作通常使用背景图片,现在用CSS3代码就能实现尖角效果(需浏览器支持CSS3属性). 运用CSS3样式实现尖角标签,只需要写简单的HTML结构和CSS样式. <p> ...

  4. 用CSS3制作尖角标签按钮样式

    如图的效果.标签有背景色,且左侧有一个三角形,三角形中间有个白色的圆圈. 你一定在想这个效果是背景图切出来的吧——答案是没有用到任何图片 那你会不会在想这个效果的html结构很复杂呢——答案是最简单的 ...

  5. CSS3给页面打标签

    我们经常会在页面的左上角或者右上角看到类似如图所示的标签,比如页面的链接(最常使用)等,下面我们就实现一个简单的标签 实现步骤是先做一个水平长条,使用CSS3的transform来实现旋转,如果是在左 ...

  6. 使用CSS3中的input标签与lable标签组合实现banner图的切换

    在做网页时,我们经常可以碰到banner图的切换.对于那些JS薄弱的同学来说,这就很尴尬了.今天,我来告诉大家如何使用CSS做出banner图切换的效果. 这里,用到了lable标签与input的组合 ...

  7. HTML标签速记整理W3C

    标题 <h1>段落<p>链接< href="">图像<img src="">自关闭元素,不需要结束标记换行标志& ...

  8. CSS3新增特性\HTML标签类型

    RGBA:透明度      作用: 设置透明度(R G B A)   opacity:不透明度     文字也会被设置不透明度   圆角      border-radius:圆角{左上角,右上角.. ...

  9. CSS3 banner图片的标签效果

    放body看,你懂的:)

随机推荐

  1. .NET设计模式(5):工厂方法模式(Factory Method)

    ):工厂方法模式(Factory Method)    工厂方法模式(Factory Method) --.NET设计模式系列之五 Terrylee,2004年1月2日 转载:http://terry ...

  2. 自定义滚动条CSS样式

    首先,给个默认css,清除掉以前的样式,给默认背景 .scrollbar { margin-left: 30px; float: left; height: 300px; width: 65px; b ...

  3. iOS开发-控件设置

    一.用户界面控件共有三种基本模式:动态.静态(非动态)和被动 动态:点击它们时会发生事情——通常是出发一段自己编写的时间代码. 被动:仅用于存储用户输入的值,以备后续使用.这些控件不会触发任何操作方法 ...

  4. lightoj1104(数学概率与期望)

    题意: 增加一年有n天; 那么至少有几个人,能够保证至少两个人同一天生日的概率大于等于0.5; 思路: 转化一下题意; 就是求全部人生日都不同的概率小于等于0.5(那么至少两个人同一天就是大于等于0, ...

  5. JS 实现2+2=5的代码 实现原理解析

    当我在http://segmentfault.com/q/1010000000531302 看到的时候 先是一惊. 这是代码 g = function () {   H = 3   return H ...

  6. #define和预编译指令

    今天再总结一点#define和预处理指令的使用. 预处理过程扫描源代码,对其进行初步的转换,产生新的源代码提供给编译器.可见预处理过程先于编译器对源代码进行处理. 预处理指令是以#开头的代码行,#后是 ...

  7. tar备份系统的方法

    下面是备份系统的方法: 然后打开终端,输入以下命令: 1.成为根用户:   sudo su 2.转到根目录:   cd / 然後,下面就是我用来备份我的系统的完整的命令:tar -cvpzf /med ...

  8. js代码 设为首页 加入收藏

    // JavaScript Document // 加入收藏 <a onclick="AddFavorite(window.location,document.title)" ...

  9. Helpers\Data

    Helpers\Data Data helper contains a bunch of useful methods for looking at and altering your data. D ...

  10. CSS3——选项卡切换

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...