css3小总结
一.边框
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小总结的更多相关文章
- css3 小图标提示特效
最近的计划,就是每天来几个特效,当然这里有限制,在什么候选区只能放一个,还每天有限制发布的,哎, 啊 终于写完了,看到一个挺好玩的东西,想到能不能用网页的特效做出来,试试呗!不过,一想肯东有很多的 相 ...
- CSS3小黄人
CSS3实现小黄人 效果图: 代码如下,复制即可使用: <!DOCTYPE HTML> <HTML> <head> <title>CSS3实现小黄人&l ...
- CSS3 小黄人案例
使用 CSS3 和 HTML5 制作一个小黄人. 结构代码: <div class="wrap"> <!-- 头发 --> <div class=&q ...
- CSS3小清新下拉菜单 简易大方
之前有分享过几款CSS3菜单和jQuery菜单,像这款HTML5/CSS3自定义下拉框 3D卡片折叠动画3D效果非常华丽,这次要分享的这款相对比较简单,很适合用在用户的操作面板上.先来看看效果图: 怎 ...
- css3小动画:鼠标hover后text-decoration的动画
实现效果 具体实现 利用css3 ::after或者::before伪元素实现.html代码 <a class="abstract-title" href="/ar ...
- CSS3小笔记
border-radius:圆角属性:border-radius:左上,右上,右下,左下.transform:rotate(角度):transparent 透明的三角形的写法设置宽和高为0,设置边框的 ...
- css3 小三角的用法
<div class="arrow-up"> <!--向上的三角--> </div> <div class="arrow-dow ...
- Css3小技术
圆角border-radius border-radius:length *注: 这是一个缩写,相当于四个角设置同样的值,用px或者百分比都可以,想要成为圆形,就用50%,你也可以单独设置每个角,语法 ...
- CSS3小图标菜单导航
在线演示 本地下载
随机推荐
- 对病毒Virus.Win32.Ramnit.B的研究
- 问题1:Mybatis 中 Signature中的参数args 问题2:MetaObject中 forObject方法中的参数
1.@Intercepts({@Signature(type =StatementHandler.class, method = "prepare", args ={Connect ...
- APS.net controller
在controller 路由配置为: routes.MapRoute( name:"Default", url:"{controller}/{action}/{id}&q ...
- table 固定表头
1 .table { border-collapse: collapse; } .table th { display: table-cell; } .fixedThead {//thead disp ...
- 查询阻塞的sql
WITH ProcessCTE(blocked) AS ( SELECT blocked FROM sys.sysprocesses WHERE blocked>0 union SELECT s ...
- AngulaJS路由 ui-router 传递多个参数
定义路由: .state('txnresult', { url: '/txnresult/:originAmount/:finalAmount/:currentPoint/:txnId/:discou ...
- vim的共享系统剪贴板以及缩进相关问题
http://www.cnblogs.com/end/archive/2012/06/01/2531147.html:reg 可以显示可用的寄存器,其中注意两个特殊的寄存器:"* 和 &qu ...
- delphi安装 Tclientsocket, Tserversocket控件
菜单component->Install Packets按Add按钮,选择delphi目录里的bin目录下的dclsockets70.bpl(delphi2010是 dclsockets140. ...
- tfs 任务自定义项
vs 命令 cd C:\Program Files\Microsoft Visual Studio 11.0\Common7\IDE\PrivateAssemblies 导出工作项类型文件 修改xml ...
- Palindrome Pairs
Given a list of unique words. Find all pairs of distinct indices (i, j) in the given list, so that t ...