HTML 5 和 CSS3 新增内容

  1. 添加了标示页面结构的元素，如 section, header, footer, nav, article, hgroup 和 aside 等。
  2. HTML 5 新增了本地存储，Web Storage . Web Storage 包括 2 个 API 接口 sessionStorage 和 localStorage。
  3. 支持离线缓存
  4. 更多的 input 类型，如 search, email, number, range, tel 和 url 等
  5. Geolocation 进行地理定位
  6. CSS 3 的选择器更加灵活，包括更多的属性选择器和伪类选择器
  7. CSS 3 背景支持多个图片，支持圆角边框和阴影
  8. 支持 Viewport 和 Media Queries 来应对不同的分辨率和屏幕大小
时间： 2024-10-11 20:54:41

HTML 5 和 CSS3 新增内容的相关文章

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

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

CSS3新增特性

CSS3新增属性选择器 属性名称 含义 [att^="value"] 该属性的值以指定的值开始 [att$="value"] 该属性的值以指定的值结束 [att*="value"] 该属性的值包含指定的值,而无论其位置 RGBA透明度 当设置一个RGBA色彩的时候,参数依次设定为红.蓝.绿(可以位0~255或百分数)和通道Alpha(0~1之间) 多背景图片 用户可以使用多个属性来设置背景图片或特效效果,如background-image.bac

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补充内容

一.特殊选择器 1.* 用于匹配任何的标记 2.> 用于指定父子节点关系:子节点 3.E + F 毗邻元素选择器,匹配所有紧随E元素之后的同级元素F:挨着的 4.E ~ F 匹配所有E元素之后的同级元素F:同级的 5.名称[表达式] 5.1 E[attr] 匹配所有具有attr属性的E元素([attr]获取所有的定义了attr]的标签): 5.2 [attr=val] 获取所有定义了attr属性并且属性值等于val的标签:如果不指定val,则与5.1相同. 5.3 [attr^=val]获取所有

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新增文本属性详述

CSS文本属性复习 1.white-space:对象内空格的处理方式 2.direction:文本流的方向 3.unicode-bidi:用于同一个页面里存在从不同方向读进的文本显示.与direction属性一起使用 1.white-space:对象内空格的处理方式 nowrap 控制文本不换行 pre 空白会被浏览器保留 normal 默认状态 pre-line 合并空白 保留换行符 pre-wrap 保留空白 正常换行 nowrap经常配合text-overflow一起使用,使得超出部分显示

CSS3新增属性text-overflow(省略符)实战开发详解

有人会问,为什么我把text-overflow拿出来单独讲解.以前,当一行内容显示不完整的时候,想要显示省略符,需要通过javascript等手段. 但是CSS3引入了text-overflow省略符属性,只需要短短一行代码就可以实现,开发方式的简洁强大不言而喻. 这篇文章,我讲带领大家做一个<今日头条>新闻导航列表,带领大家领略text-overfow的强大魅力.先看一下效果: 好了,看完了效果,现在正式开始今天的开发旅程吧! 首先我们先创建html页面,代码如下所示(红色文字即是我们Dem

CSS3新增属性text-shadow详解及燃烧的字体实战开发

今天我们有很多程序员在给文本设置样式时,都感觉无从下手.一般有两种情况: 1) 不知道关于文本到底有哪些样式属性: 2) 即使借助开发工具的自动提醒,依然不清楚样式属性的具体意思,以及具体用法. 今天这篇文章,我将带领大家一起来领受CSS3在文本样式应用方面的超强能力.通过精彩的实例,来使大家重新认识CSS3文本样式,真心希望大家通过此篇文章,即使不能做到精通CSS3的文本样式的应用,也会做到熟练应用. 实例: 如何利用CSS3制作燃烧的字体? 以前,如果我们网页上想要显示一个燃烧着的文本,大家