第1章 初识CSS3

什么是CSS3?

CSS3是CSS2的升级版本,3只是版本号,它在CSS2.1的基础上增加了很多强大的新功能。 目前主流浏览器chrome、safari、firefox、opera、甚至360都已经支持了CSS3大部分功能了,IE10以后也开始全面支持CSS3了。

在编写CSS3样式时,不同的浏览器可能需要不同的前缀。它表示该CSS属性或规则尚未成为W3C标准的一部分,是浏览器的私有属性,虽然目前较新版本的浏览器都是不需要前缀的,但为了更好的向前兼容前缀还是少不了的。

| 前缀 | 浏览器 |

|--|--|

| -webkit | chrome和safari |

| -moz | firefox |

| -ms | IE |

| -o | opera |

CSS3能做什么?

CSS3给我们带来了什么好处呢?简单的说,CSS3把很多以前需要使用图片和脚本来实现的效果、甚至动画效果,只需要短短几行代码就能搞定。比如圆角,图片边框,文字阴影和盒阴影,过渡、动画等。

CSS3简化了前端开发工作人员的设计过程,加快页面载入速度。

CSS3都有哪些强大功能呢?各位小伙伴们先来一睹为快吧!

选择器

以前我们通常用class、 ID 或 tagname 来选择HTML元素,CSS3的选择器强大的难以置信。它们可以减少在标签中的class和ID的数量更方便的维护样式表、更好的实现结构与表现的分离。

圆角效果

以前做圆角通常使用背景图片,或繁琐的元素拼凑,现在很简单了 border-radius 帮你轻松搞定。

块阴影与文字阴影

可以对任意DIV和文字增加投影效果。

色彩

CSS3支持更多的颜色和更广泛的颜色定义。新颜色CSS3支持HSL , CMYK ,HSLA and RGBA。

渐变效果

以前只能用Photoshop做出的图片渐变效果,现在可以用CCS写出来了。IE中的滤镜也可以实现。

个性化字体

网页上的字体太单一?使用@Font-Face 轻松实现定制字体。

多背景图

一个元素上添加多层背景图片。

边框背景图

边框应用背景图片。

变形处理

你可以对HTML元素进行旋转、缩放、倾斜、移动、甚至以前只能用JavaScript实现的强大动画。

多栏布局

可以让你不用使用多个div标签就能实现多栏布局。浏览器解释这个属性并生成多栏,让文本实现一个仿报纸的多栏结构。

媒体查询

针对不同屏幕分辨率,应用不同的样式。

等等 ……

很神奇吧!CSS3使代码更简洁、更高效。可以极大的提高工作效率,打造更高级的用户体验。使web应用的界面设计进入一个新的台阶。

原文地址:https://www.cnblogs.com/both-eyes/p/10084470.html

时间: 2024-11-02 18:34:37

第1章 初识CSS3的相关文章

CSS3 - 初识CSS3

.navdemo{ width:560px; height: 50px; font:bold 0/50px Arial; text-align:center; margin:40px auto 0; background: #f65f57; /*制作圆*/ border-radius:5px; /*制作导航立体风格*/ box-shadow:0 5px 5px 0px gray; } .navdemo a{ display: inline-block; -webkit-transition: a

《图解CSS3——第一章 揭开CSS3的面纱》

第一章 揭开CSS3的面纱 如果关注前端方面的技术,那么对CSS一定不会陌生,你肯定听说过CSS3.在使用CSS3之前,应该对这个新一代语言样式表语言的来龙去脉有个基本了解. 1.1 什么是CSS3 CSS3并不是一门新的语言.如果接触过CSS就知道,CSS是创建网页的另一个独立但并非不重要的一部分.CSS是种层叠样式表,是一种样式语言,用来告诉浏览器如何渲染你的web页面. CSS3是CSS规范的最新版本 1.1.1 CSS3的新特性 CSS3新特性非常多,这里挑选一些被浏览器支持较为完美.更

第9章 初识STM32固件库—零死角玩转STM32-F429系列

第9章 ????初识STM32固件库 全套200集视频教程和1000页PDF教程请到秉火论坛下载:www.firebbs.cn 野火视频教程优酷观看网址:http://i.youku.com/firege ? 本章参考资料:<STM32F4xx参考手册>.<STM32F4xx规格书>.<Cortex-M3权威指南>, STM32标准库帮助文档:<stm32f4xx_dsp_stdperiph_lib_um.chm>. 在上一章中,我们构建了几个控制GPIO外

第二章 初识JSP

第二章   初识JSP 一.JSP简述 1.是JSP JSP是指在HTML中嵌入Java脚本语言.全称(Java Server Pages) 当用户通过浏览器访问Web应用时,使用JSP容器对请求的JSP进行处理和运行,然后将生成的页面返回客户端浏览器进行显示. Tomcat服务器属于JSP容器的一种. 2.JSP的由来 JSP是由Sun公司倡导.许多公司共同参与,一起建立起来的一种动态网页技术标准. 并具有跨平台.易维护性.易管理性等优点. 3.JSP的组成部分 JSP页面由:静态内容.指令.

第4章 初识STM32

第4章     初识STM32 全套200集视频教程和1000页PDF教程请到秉火论坛下载:www.firebbs.cn 野火视频教程优酷观看网址:http://i.youku.com/firege 本章参考资料:1.<STM8和STM32产品选型手册>2.SetupSTM32CubeMX-4.11.0.exe 4.1 什么是STM32 STM32,从字面上来理解,ST是意法半导体,M是Microelectronics的缩写,32表示32位,合起来理解,STM32就是指ST公司开发的32位微控

第9章 初识STM32固件库

第9章     初识STM32固件库 全套200集视频教程和1000页PDF教程请到秉火论坛下载:www.firebbs.cn 野火视频教程优酷观看网址:http://i.youku.com/firege 本章参考资料:<STM32F4xx参考手册>.<STM32F4xx规格书>.<Cortex-M3权威指南>, STM32标准库帮助文档:<stm32f4xx_dsp_stdperiph_lib_um.chm>. 在上一章中,我们构建了几个控制GPIO外设的

第四章:初识CSS3

1.CSS规则由两部分构成,即选择器和声明器 声明必须放在{}中并且声明可以是一条或者多条 每条声明由一个属性和值构成,属性和值用冒号分开,每条语句用英文冒号分开 注意: css的最后一条声明,用以结束的";"可写可不写,但是基于W3c标准规范思考建议最后一条声明的结束":"都要写上 2.行内样式 直接在style属性设置css样式style属性提供了一种改变所有的HTML元素样式的通用方法 语法: <h1 style="color:red"

《C语言启蒙》--第一章 初识c语言

阅读书籍的名称  <c primer> c语言的启蒙书籍. 第一章:初识c语言 1背景: c 语言很牛逼,可以跨平台,必须得会. 2.计算机的工作原理: 3.编译的过程 我们写完的代码称之为源代码,程序运行的实质是对01的不同位置的变化,而源代码需要转化成cpu可以执行的指令,也就是机器码,这个过程就是编译的过程,需要编译器来帮助我们来完成,c语言的文件中你肯定会用到各种库,这就需要c可以引入操作系统中的库文件,同时文件的启动需要启动代码,这些都需要引入,这个引入的工具就是连接器,最终将各个文

Windows Forms编程实战学习:第一章 初识Windows Forms

初识Windows Forms 1,用C#编程 using System.Windows.Forms; ? [assembly: System.Reflection.AssemblyVersion("1.0")] ? namespace MyNamespace { public class MyForm : Form { public MyForm() { this.Text = "Hello Form"; } [System.STAThread] public s