5 用户界面属性

在CSS3中,新的用户界面特性包括重设元素尺寸、盒尺寸及轮廓等。本小节着重介绍一下resize属性,只有Firefox 4和Safari 3浏览器支持此属性。resize属性可用于重定义textarea的大小,可能的值包括如下几种。

Ø none:UserAgent没有提供尺寸调整机制,用户不能调节元素的尺寸。

Ø both:UserAgent提供了双向尺寸调整机制,用户可以调节元素的宽度和高度。

Ø horizontal:UserAgent提供了单向水平尺寸调整机制,用户可以调节元素的宽度。

Ø vertical:UserAgent提供了单向垂直尺寸调整机制,用户可以调节元素的高度。

示例代码如下所示:

6  动画属性

也许CSS3最令人兴奋的增补,就是在没有JavaScript元素的情况下产生动画。CSS3的动画有3个常用属性:transform﹑transition﹑animation。transform属性虽然看起来可以实现动画的效果,但其本质是静态的,其实就是一个图形的变形工具;而transition属性是一个简单的动画属性,操作起来非常简单;animation属性是一个名副其实的动画属性,是transition属性的扩展,但功能十分强大,可以定义多个关键帧及每个关键帧中元素的属性值来实现复杂的动画效果。下面的示例使用transition属性模仿一个效果,当鼠标滑过右侧链接时,文本向右滑动。

IT兄弟连 HTML5教程 CSS3揭秘 CSS3属性3的更多相关文章

  1. IT兄弟连 HTML5教程 CSS3揭秘 CSS3属性5

    9  透明属性 元素透明也是我们常用的样式,在CSS2中使用滤镜属性opacity实现透明效果.现在有了CSS3的rgba属性,就不用这么麻烦了,当然这也得要浏览器支持才行.通常我们定义颜色都是用十六 ...

  2. IT兄弟连 HTML5教程 CSS3揭秘 CSS3属性1

    通过CSS选择器找到元素,就要使用CSS属性给找到的元素设置样式.尽管现在的浏览器已经支持了众多的CSS3属性,但作为初学者,最应该关注的就是一些“主流”的属性,如border-radius.box- ...

  3. IT兄弟连 HTML5教程 CSS3属性特效 CSS3背景

    CSS3规范中对背景这一部分,新加入了一些有用的功能,如可以设置多个背景图片.可以指定背景大小.设置背景渐变等功能.CSS3规范中定义的背景属性新增了background-clip.backgroun ...

  4. IT兄弟连 HTML5教程 CSS3属性特效 渐变1

    渐变背景一直以来在Web页面中都是一种常见的视觉元素.但一直以来,Web设计师都是通过图形软件设计这些渐变效果,然后以图片形式或者背景图片的形式运用到页面中.Web页面上实现的效果,仅从页面的视觉效果 ...

  5. IT兄弟连 HTML5教程 CSS3属性特效 倒影

    在Web制作中,有些时候需要实现一些倒影的效果.在传统网页中,我们只能使用photoshop事先将倒影设计好,然后导入到网页中,这样不但耗费资源,也阻碍了开发效率.而CSS新增了Reflections ...

  6. IT兄弟连 HTML5教程 CSS3属性特效 新增颜色模式

    对于设计人员和开发人员来说,CSS一直是web设计过程中重要的一部分.网页外观主要由CSS控制,编写CSS代码可以任意改变我们的网页布局以及网页内容的样式.随着CSS3的出现以及越来越多的浏览器对它的 ...

  7. IT兄弟连 HTML5教程 多媒体应用 小结及习题

    小结 在互联网上,图像和链接则是通过URL唯一确定信息资源的位置.URL分为绝对URL和相对URL.通过使用<img />标记在浏览器中显示一张图像.超文本具有的链接能力,可层层链接相关文 ...

  8. IT兄弟连 HTML5教程 CSS3揭秘 CSS3属性4

    7  多列布局属性 通过CSS3,开发人员能够创建多列来对文本进行布局.在CSS2时代,对于多列布局的设计,大多采用浮动布局和绝对定位布局两种方式.浮动布局比较灵活,但是需要编写大量的附加样式代码,而 ...

  9. IT兄弟连 HTML5教程 CSS3揭秘 CSS3属性2

    3  背景属性 在CSS3中提供了多个背景属性,这里只介绍两个比较常用的属性,其他属性可以从手册中获取帮助.在CSS3中,通过background-image或者background属性可以为一个容器 ...

随机推荐

  1. java—将数据库读取的list转tree

    一.引言 有时候我们从数据库中读取出了一个表的数据,比如存储的是中国的省市县的ID.名称与父节点ID,读出来的数据并不是前台想要的,这个时候我们要想法处理一下都出来的list,将它变为一个树. 比如直 ...

  2. Python读写Excel表格(简单实用)

    前言 本文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理.作者:giao窝里giao首先安装两个库:pip install xlrd. ...

  3. iOS核心动画高级技巧 - 6

    11. 基于定时器的动画 基于定时器的动画 我可以指导你,但是你必须按照我说的做. -- 骇客帝国 在第10章“缓冲”中,我们研究了CAMediaTimingFunction,它是一个通过控制动画缓冲 ...

  4. 简单实用的git命令

    1.下载项目 先进入目录然后使用jit $ git clone +"url" 2.项目配置 $ composer install 3.上传项目 $ git add . () $ g ...

  5. Neo4j安装过程详解

    在安装neo4j之前,需要安装Java JRE,并配置Java开发环境,然后安装neo4j服务. 一.CentOS下安装 1.下载Neo4j 去官网下载最新的neo4j,选择社区版.地址:https: ...

  6. Nginx:基本概念

    守住一方平安,尽力而为,问心无愧就好.     Nginx同Apache一样都是一种WEB服务器,Nginx是一款自由的.开源的.高性能的HTTP服务器和反向代理服务器:同时也是一个IMAP.POP3 ...

  7. 2019年Java面试题基础系列228道(2)

    21.描述一下 JVM 加载 class 文件的原理机制? JVM 中类的装载是由类加载器(ClassLoader)和它的子类来实现的,Java 中的类加载器是一个重要的 Java 运行时系统组件,它 ...

  8. vue app项目 第一天 基本架构和路由配置

    一.前言 今天开始打算花6天时间 完成一个基于vue的买菜app 在这里记录一下项目的流程和第一次做这个项目遇到的坑 以及解决的办法 二.第一步 脚手架的安装 使用npm 安装好脚手架  安装脚手架教 ...

  9. Consul-template+nginx实现自动负载均衡

    前言 consul-template 是 Consul 的一个守护程序,使用 consul-template 可以方便快速的实现对 Consul Key/Value 存储系统的访问,可以从 KV 系统 ...

  10. RabbitMQ 在.Net 中的使用

    RabbitMQHelper public static class RabbitMQHelper { // 定义 RabbitMQ 基本参数 private static string HostNa ...