CSS3的几个标签速记1
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的更多相关文章
- CSS3的几个标签速记3
transition:CSS3过渡 css3里很好的一个标签,可以非常方便的完成需要很多JS才能完成的动态效果 例语法:transition:width 2S,height 2S,transf ...
- 12种炫酷HTML5 SVG和CSS3表单浮动标签特效
这是一组效果非常炫酷的HTML5 SVG和CSS3表单浮动标签特效.这组浮动标签特效共12种效果,使用SVG和CSS3来制作完成.这些浮动标签效果部分在元素的伪元素上使用CSS transitions ...
- CSS3之尖角标签
如图所示,Tag标签的制作通常使用背景图片,现在用CSS3代码就能实现尖角效果(需浏览器支持CSS3属性). 运用CSS3样式实现尖角标签,只需要写简单的HTML结构和CSS样式. <p> ...
- 用CSS3制作尖角标签按钮样式
如图的效果.标签有背景色,且左侧有一个三角形,三角形中间有个白色的圆圈. 你一定在想这个效果是背景图切出来的吧——答案是没有用到任何图片 那你会不会在想这个效果的html结构很复杂呢——答案是最简单的 ...
- CSS3给页面打标签
我们经常会在页面的左上角或者右上角看到类似如图所示的标签,比如页面的链接(最常使用)等,下面我们就实现一个简单的标签 实现步骤是先做一个水平长条,使用CSS3的transform来实现旋转,如果是在左 ...
- 使用CSS3中的input标签与lable标签组合实现banner图的切换
在做网页时,我们经常可以碰到banner图的切换.对于那些JS薄弱的同学来说,这就很尴尬了.今天,我来告诉大家如何使用CSS做出banner图切换的效果. 这里,用到了lable标签与input的组合 ...
- HTML标签速记整理W3C
标题 <h1>段落<p>链接< href="">图像<img src="">自关闭元素,不需要结束标记换行标志& ...
- CSS3新增特性\HTML标签类型
RGBA:透明度 作用: 设置透明度(R G B A) opacity:不透明度 文字也会被设置不透明度 圆角 border-radius:圆角{左上角,右上角.. ...
- CSS3 banner图片的标签效果
放body看,你懂的:)
随机推荐
- Resharp非常实用的快捷键
Alt+Home 定位到父类.父接口 Alt + End 定位到子类 Ctrl+T 快速在整个解决方案下搜索 类型.方法.文件夹 Alt+Ctrl+Spance 给出提示框 Shift+F ...
- PowerDesigner实用技巧小结(4)
下述十四个技巧,是许多人在大量的数据库分析与设计实践中,逐步总结出来的.对于这些经验的运用,读者不能生帮硬套,死记硬背,而要消化理解,实事求是,灵活掌握.并逐步做到:在应用中发展,在发展中应用. 1. ...
- tomcat+JNDI+spring 的配置问题
在做spring有关的项目时,往往需要配置数据源,当然配置的方式有很多种,可以单独写在一个properties文件中,这样修改数据源配置的话比较容易,也比较简单,下面介绍另外一种数据源的配置 利用jn ...
- linux系统基础(二)
磁盘管理(一) Linux设备认识 /dev/cdrom /dev/sr0 /dev/mouse /dev/sda /dev/hda IDE硬盘(支持4块):hd(a-d) [非IDE硬盘]SCSI硬 ...
- SQLite使用教程4 创建数据库
http://www.runoob.com/sqlite/sqlite-create-database.html SQLite 创建数据库 SQLite 的 sqlite3 命令被用来创建新的 SQL ...
- 分析Model2系统心得
分析Model2系统心得 前言:观摩他人的项目,学到一些新的.实践经验呀!!! 1. 怎样使用字符串处理类?从页面获取的Form类或者字段取值时使用. 2.在验证用户身份时,先推断username, ...
- DP练习(初级):ZigZag
题目来源:http://community.topcoder.com/stat?c=problem_statement&pm=1259&rd=4493 类似于求最长子串的方法.dp[0 ...
- ubuntu下设置开机自启动项
可用一些小工具来管理 Ubuntu 的启动选项: 小工具 rcconf: #sudo apt-get rcconf #sudo apt-get install rcconf root 下运行: #su ...
- File类的基本操作之读出所有目录路径
package org.mark.file; import java.io.File; /** * File类的基本操作之读出所有文件夹路径 * 假设给定一个文件夹,要求将此文件夹中的所有文件都列出来 ...
- Redis 和 Memcached 的区别
来源:标点符 链接:http://www.biaodianfu.com/redis-vs-memcached.html Redis 的作者 Salvatore Sanfilippo 曾经对这两种基于内 ...