CSS3新增特性

CSS3新增属性选择器


属性名称
含义

[att^="value"]
该属性的值以指定的值开始

[att$="value"]
该属性的值以指定的值结束

[att*="value"]
该属性的值包含指定的值，而无论其位置

RGBA透明度

当设置一个RGBA色彩的时候，参数依次设定为红、蓝、绿（可以位0~255或百分数）和通道Alpha（0~1之间）

多背景图片

用户可以使用多个属性来设置背景图片或特效效果，如background-image、background-repeat、background-size、background-position、background-originand和background-clip

多栏布局

用户通过选择器定义3部分内容，如栏数(column-count)、栏宽(column-width)和各栏之间的空白和间距

字符串溢出

word-wrap属性用于防止太长的字符串溢出，属性值:normal(默认的)只在允许的断点截断文字，break-work表示在结束的时候截断

box-shadow和text-shadow定义圆角阴影和块阴影。

border-radius属性无需背景图片就能给HTML元素添加圆角。

border-image属性可以定义设置border的背景图，允许用户在元素的边框上设定图片。

rotate属性可以实现旋转、scale属性实现伸缩，skew属性实现倾斜等效果。

时间： 2024-10-21 14:43:33

CSS3新增特性的相关文章

CSS3新增特性\HTML标签类型

RGBA:透明度 作用: 设置透明度(R G B A)   opacity:不透明度     文字也会被设置不透明度   圆角 border-radius:圆角{左上角,右上角...} 块阴影 box-shadow:{水平阴影宽度(负号向下) 垂直阴影宽度(负号向右) 透明度 颜色} text-shadow:{水平阴影宽度(负号向下) 垂直阴影宽度(负号向右) 透明度 颜色} HTML标签类型分为3大类 块级标签 独占一行 能随时设置宽度和高度(div,p,h,ul,li) 行内标签(内联) 多

CSS选择符、属性继承、优先级算法以及CSS3新增伪类、新特性

CSS 选择符有哪些?哪些属性可以继承?优先级算法如何计算? CSS3新增伪类有那些?CSS新增了哪些特性?下面我整理了一些,仅供参考. CSS 选择符: 1)      id选择器(# myid) 2)      类选择器(.myclassname) 3)      标签选择器(div, h1, p) 4)      相邻选择器(h1 + p) 5)      子选择器(ul > li) 6)      后代选择器(li a) 7)      通配符选择器( * ) 8)      属性选择器

CSS3新增属性css版

最近学习CSS3,以下CSS文件中的内容来自CSS手册. 可直接调用此CSS查看效果. 若有遗漏,待发现后补充进去. @charset "utf-8"; /* ------------------------- 此文档收集并介绍CSS3新增属性 ------------------------ /*----------border-color--------- 设置对象边框的颜色. --------------------- 浏览器支持:Firefox3.0+ ------------

HTML5+CSS3新增内容总结！！！！！绝对干货

说到H5C3会不会觉得东西好多啊,今天就整理了一份总结性的内容: CSS3选择器有哪些?答:属性选择器.伪类选择器.伪元素选择器.CSS3新特性有哪些?答:1.颜色:新增RGBA,HSLA模式 文字阴影(text-shadow.) 边框: 圆角(border-radius)边框阴影: box-shadow 盒子模型:box-sizing 背景:background-size 设置背景图片的尺寸background-origin 设置背景图片的原点background-clip 设置背景图片的裁切

h5新增和css3新增

编辑器: webstorm, 英文版 sublime, hbuilder vscode, dwh5的新标签及特性(移动端用的多),,,,如果想在图片里面显示 “帅哥" 记得使用单双引号,外面是单引号,里面是双引号例如: <img src="" title='这里有一个"傻狗"'/>h5新增语义化标签:(对浏览器和搜索引擎友好,)div没有语义化, 都可能出现很多次 section元素 表示页面中的一个区块 article 元素: 表示页面中的一

CSS3新增功能02

1. CSS3中background新属性 1.1 background-size:直接设置图片的大小. 1.1.1 可以使用数值直接设置宽高. 1.1.2 cover:缩放图片,铺满盒子,图片的宽高比不变,会使图片某一部分伸出盒子范围. 1.1.3 contain:缩放图片,不会铺满盒子,图片的宽高比不变,在图片全部在盒子范围内的前提下,缩放图片直到图片的宽或者高达到盒子对应的值,会使盒子有一部分为空白. 1.2 background-origin:设置图片在盒子中开始显示的位置 1.2.1

CSS3新增颜色属性

CSS颜色属性复习 color name 颜色英文名称命名(如red,blue,pink,white等) HEX方式 十六进制方式(#FF0000,#B9B9B9等) rgb方式 三原色配色方式(rgb(255,0,00)) 这几种方式都是常用到的颜色属性,本人使用较多的是HEX方式.CSS3中新增了几种颜色属性. CSS3新增颜色属性 1.RGBA模式 2.HSL模式 3.HSLA模式 1.RGBA模式 rgba在之前一遍博客中已经提及过,a表示的是透明度,取值范围为0~1,rgb分别是红绿蓝

CSS系列：CSS3新增选择器

CSS系列:CSS3新增选择器 1. CSS1定义的选择器 选择器 类型 说明 E 类型选择器 选择指定类型的元素 E#id ID选择器 选择匹配E的元素,且匹配元素的id为“id”,E选择符可以省略. E.class 类选择器 选择匹配E的元素,且匹配元素的class属性值为“class”,E选择符可以省略. E F 包含选择器 选择匹配F的元素,且该元素被包含在匹配E的元素内. E:link 链接伪类选择器 选择匹配E的元素,且匹配元素被定义了超链接并未被访问.例:a:link E:visi

CSS3新特性简介

1.CSS3 边框:通过 CSS3,能够创建圆角边框,向矩形添加阴影,使用图片来绘制边框,如border-radius:box-shadow:border-image 2.CSS3 背景:CSS3 包含多个新的背景属性,它们提供了对背景更强大的控制.background-size:background-origin 3.CSS3 文本效果:CSS3 包含多个新的文本特性.text-shadow:word-wrap 4.CSS3 @font-face规则:可将设计师希望使用的字体文件存放到web服