一.边框

1.border-radius:x,y,模糊半径,color(x为负数时左移动,y为负数是上移动)

2.box-radius:x,y,模糊半径,阴影半径,color

3.border-image:url() 切割图片的大小 repeat/round(平铺)/stretch(拉伸)。(*)

二.文字与字体

1.text-shadow:x,y,模糊半径,color;

2.@font-face{

font-family:"mooc "

url(字体服器上的链接地址);

}

p{font-family:"mooc "}

3.text-overform:over;但是text-overflow只是用来说明文字溢出时用什么方式显示,要实现溢出时产生省略号的效果,还须定义强制文本在一行内显示(white-space:nowrap)及溢出内容为隐藏(overflow:hidden),只有这样才能实现溢出文本显示省略号的效果,

三.颜色

1.background:rgba(111,33,22,0.5)R,G,B 0-255之间的值,0-1之间的透明度。

2.background:linear-gradient(top left,yellow,red,blue)90deg=to left,270deg=to right/180=to bottom/0=to top /to top left上角到左上/to top right左上角到右上角。

四.与背景相关的样式

1.background-fize:20px 30px 背景缩放cover图片覆盖整个容器content沿边覆盖。

2.background-origin:padding-box/border/box/content-box背景开始位置

3.background-clip:padding-box/border/box/content-box背景图片裁剪的位置

4.multip-background:背景多重样式。

a:hover 必须被置于 a:link 和 a:visited 之后,才是有效的,a:active 必须被置于 a:hover 之后,才是有效的。


css3小总结的更多相关文章

  1. css3 小图标提示特效

    最近的计划,就是每天来几个特效,当然这里有限制,在什么候选区只能放一个,还每天有限制发布的,哎, 啊 终于写完了,看到一个挺好玩的东西,想到能不能用网页的特效做出来,试试呗!不过,一想肯东有很多的 相 ...

  2. CSS3小黄人

    CSS3实现小黄人 效果图: 代码如下,复制即可使用: <!DOCTYPE HTML> <HTML> <head> <title>CSS3实现小黄人&l ...

  3. CSS3 小黄人案例

    使用 CSS3 和 HTML5 制作一个小黄人. 结构代码: <div class="wrap"> <!-- 头发 --> <div class=&q ...

  4. CSS3小清新下拉菜单 简易大方

    之前有分享过几款CSS3菜单和jQuery菜单,像这款HTML5/CSS3自定义下拉框 3D卡片折叠动画3D效果非常华丽,这次要分享的这款相对比较简单,很适合用在用户的操作面板上.先来看看效果图: 怎 ...

  5. css3小动画:鼠标hover后text-decoration的动画

    实现效果 具体实现 利用css3 ::after或者::before伪元素实现.html代码 <a class="abstract-title" href="/ar ...

  6. CSS3小笔记

    border-radius:圆角属性:border-radius:左上,右上,右下,左下.transform:rotate(角度):transparent 透明的三角形的写法设置宽和高为0,设置边框的 ...

  7. css3 小三角的用法

    <div class="arrow-up"> <!--向上的三角--> </div> <div class="arrow-dow ...

  8. Css3小技术

    圆角border-radius border-radius:length *注: 这是一个缩写,相当于四个角设置同样的值,用px或者百分比都可以,想要成为圆形,就用50%,你也可以单独设置每个角,语法 ...

  9. CSS3小图标菜单导航

    在线演示 本地下载

随机推荐

  1. 双二次Lagrange 有限元计算特征值程序(基于iFEM)

    function lambda = c0P2(h) %% Mesh [node,elem] = squarequadmesh([,,,],h); elem = elem(:,[,,,]); showm ...

  2. MySQL优化的奇技淫巧之STRAIGHT_JOIN

    原文地址:http://huoding.com/2013/06/04/261 问题 通过「SHOW FULL PROCESSLIST」语句很容易就能查到问题SQL,如下: SELECT post.* ...

  3. IDEA内存溢出问题:

    -Xms1024m -Xmx1024m -XX:MaxPermSize=512m 内存泄露是指程序中间动态分配了内存,但在程序结束时没有释放这部分内存,从而造成那部分内存不可用的情况,重启计算机可以解 ...

  4. Linux性能工具介绍

    l  Linux性能工具介绍 p  CPU高 p  磁盘I/O p  网络 p  内存 p  应用程序跟踪 l  操作系统与应用程序的关系比喻为“唇亡齿寒”一点不为过 l  应用程序的性能问题/功能问 ...

  5. SQL语言

    SQL语言的分类:DDL DML DQL DCL SQL中的操作无非就是(增删改查) DDL:Data Query Language,数据查询语言! 主要是用来定义和维护数据库的各种操作对象,比如库. ...

  6. Could not load type 'System.Runtime.CompilerServices.ExtensionAttribute'

    [TypeLoadException: Could not load type 'System.Runtime.CompilerServices.ExtensionAttribute' from as ...

  7. Linux Svn 安装过程及配置

    重要的是第一步的安装,第二步配置可能没用,但是没试过,因为服务器上已经安装了第一步. 此处的第二步只为做个记录,说明一下里边的配置文件的用途. 3. 自己实际操作中的的配置记录(参照服务器别人的配置记 ...

  8. M站开发规范——By Klax

    M站开发的规范,根据具体情况,涉及代码组织的模式,代码编码风格,模块化等,经...研究...决定: 1.采用AMD 规范(RequireJS)实现js模块化. 2.单个文件尽量采用面向对象编程和模块化 ...

  9. 关于representation的理解

    目前见过的定义的比较确切的是Yoshua Bengio在ACL2010的一篇paper中关于word representation的定义: " A word Representation i ...

  10. 拼图 canvas分割 dom拖拽 pc 移动端

    参考:Canvas drag 实现拖拽拼图小游戏 参考的案例,不支持手机端.总结下实现过程中遇到的小坑. gitHub:https://github.com/WppFrontEnd/puzzle 大概 ...