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 - html/css语言栏目:html.css的内容,欢迎继续使用右上角搜索按钮进行搜索标签、以便于您获取更多的相关信息。
h5是html的最新版本,是14年由w3c完成标准制定。增强了,浏览器的原生功能,减少浏览器插件(eg:flash)的应用,提高用户体验满意度,让开发更加方便。
- h5新增的标签
新增元素
说明
video 表示一段视频并提供播放的用户界面
audio 表示音频
canvas 表示位图区域
source 为video和audio提供数据源
track 为video和audio指定字母
svg 定义矢量图
code 代码段
figure 和文档有关的图例
figcaption 图例的说明
main
time 日期和时间值
mark 高亮的引用文字
datalist 提供给其他控件的预定义选项
keygen 秘钥对生成器控件
output 计算值
progress 进度条
menu 菜单
embed 嵌入的外部资源
menuitem 用户可点击的菜单项
menu 菜单
template
section
nav
aside
article
footer
header
- css3
css3被划分为模块,最重要的几个模块包括:选择器、框模型、背景和边框、文本效果、2D/3D 转换、动画、多列布局、用户界面
选择器
框模型
背景和边框
border-radius、box-shadow、border-image、
background-size:规定背景图片的尺寸
background-origin:规定背景图片的定位区域
background-clip:规定背景的绘制区域
文本效果(常用)
text-shadow:设置文字阴影
word-wrap:强制换行
word-break
css3提出@font-face规则,规则中定义了font-family、font-weight、font-style、font-stretch、src、unicode-range
2/3D转换
transform:向元素应用2/3D转换
transition:过渡
动画
@keyframes规则:
animation、animation-name、animation-duration等
用户界面(常用)
box-sizing、resize
css3新增伪类
:nth-child()
:nth-last-child()
:only-child
:last-child
:nth-of-type()
:only-of-type()
:empty
:target 这个伪类允许我们选择基于URL的元素,如果这个元素有一个识别器(比如跟着一个#),那么:target会对使用这个ID识别器的元素增加样式。
:enabled
:disabled
:checked
:not