首页 > 其他分享 >HTML5+css3新增布局元素整理

HTML5+css3新增布局元素整理

时间:2022-11-24 15:32:05浏览次数:68  
标签:css3 标签 元素 新增 HTML5 选择器


HTML5新增的语义化标签

<head>:头部标签

<nav>:导航标签

<article>:内容标签

<section>:定义文档某个区域

<aside>:侧边栏标签

<footer>:尾部标签

HTML5+css3新增布局元素整理_css3

 注意:

  • 这种语义化标准主要是针对搜索引擎的;
  • 这些新标签页面中可以使用多次;
  • 在IE9中,需要把这些元素转换为块级元素;
  • 其实,我们移动端更喜欢这些标签
  • HTML5还新增了很多其他标签

例如:视频<audio>,音频<video>

使用它们可以方便的在页面中嵌入音频和视频,而不再去使用flash和其他浏览器插件。

HTML5+css3新增布局元素整理_html5_02

​https://www.w3school.com.cn/tags/tag_video.asp​

HTML5的input新增type

 

HTML5+css3新增布局元素整理_css_03

 元素选择器加伪类::

input::placeholder{
clolor:pink;
}

css3新增了选择器,可以更加便捷,更加自由选择目标元素;

1、属性选择器;

2、结构伪类选择器;

3、伪元素选择器;

HTML5+css3新增布局元素整理_css3_04

HTML5+css3新增布局元素整理_html5_05

 

HTML5+css3新增布局元素整理_css3_06

 

HTML5+css3新增布局元素整理_html_07

 

HTML5+css3新增布局元素整理_html5_08

  

HTML5+css3新增布局元素整理_css_09

 

HTML5+css3新增布局元素整理_html5_10

 

HTML5+css3新增布局元素整理_css3_11

 

HTML5+css3新增布局元素整理_html5_12

HTML5+css3新增布局元素整理_css_13

 css3的伪类选择器

HTML5+css3新增布局元素整理_css_14

 

HTML5+css3新增布局元素整理_css_15

HTML5+css3新增布局元素整理_html_16

 css3清除浮动

 

HTML5+css3新增布局元素整理_html5_17

  

HTML5+css3新增布局元素整理_ide_18

 

HTML5+css3新增布局元素整理_css_19

HTML5+css3新增布局元素整理_html_20

 

css3属性值参与计算

HTML5+css3新增布局元素整理_css_21

 css3滤镜过度

HTML5+css3新增布局元素整理_html_22

  

HTML5+css3新增布局元素整理_html_23

 

HTML5+css3新增布局元素整理_css_24

HTML5+css3新增布局元素整理_css_25

 css3ico图标转换

HTML5+css3新增布局元素整理_css3_26

 

HTML5+css3新增布局元素整理_html5_27

 css3的seo优化

HTML5+css3新增布局元素整理_css3_28

 

 

标签:css3,标签,元素,新增,HTML5,选择器
From: https://blog.51cto.com/u_15890333/5884041

相关文章