HTML5新标签和CSS伪类
HTML5提供了很多新的标签,由于HTML5的兼容性比较差,HTML5的标签常用于手机端
<nav>
<footer>
<section>
<header>
<article>
<aside>
更多HTML5新标签可以看W3Cschool
CSS3结构伪类选择器
:first-child 选中第一个元素
:last-child 选中最后一个元素
:nth-child(n) 选中第几个元素 其中n除了填写数字代表第几个元素外,填写n代表选择所有元素,2n代表选择所有偶数元素,2n-1代表选择所有奇数元素,even代表选择偶数元素,odd代表选择奇数元素
4n代表选择4的倍数的元素。。。。。
CSS3属性选择器
div[class] 选择div标签所有有类的元素
div[class^=test] 选择div标签的类的名字以test开头的元素
div[class$=test] 选择div标签的类的名字以test结尾的元素
CSS3伪元素选择器
p::first-letter 选中段落第一个字
p::first-line 选中段落第行字
p::selection 鼠标选中时段落的元素变化
!!!!!!重点!!!!!!!
p::after 和p::before(必须带content值)
::after在元素内部的后面插入content值里面的内容
::before在元素内部的前面插入content值里面的内容
其中插入的为一个行内元素盒子
HTML5新标签和CSS伪类的更多相关文章
- 超链接标签的CSS伪类link,visited,hover,active
CSS伪类,是一种特殊的类,它针对到CSS选择器起作用,使选中的标签或元素产生特定的效果. CSS伪类的语法就是: 选择器 : 伪类名 { 属性 : 属性值 } 用的最多的伪类就是超链接a的伪类,有: ...
- 12、第十二节课,css伪类 (转)
一.特殊选择器 1.* 用于匹配任何的标记 2.> 用于指定父子节点关系 3.E + F 毗邻元素选择器,匹配所有紧随E元素之后的同级元素F 4.E ~ F 匹配所有E元素之后的同级元素F 5. ...
- js动态改变css伪类样式
首先我们来看下页面上需要实现的基本效果,如下图所示: 因此我们可以使用如下js代码来试试看,是否能使用js改变伪类?如下代码所示: $(function() { $('.listnav li').cl ...
- 谈谈css伪类与伪元素
前端er们大都或多或少地接触过CSS伪类和伪元素,比如最常见的:focus.:hover以及<a>标签的:link.:visited等,伪元素较常见的比如:before.:after等. ...
- html5\CSS3有哪些新特性、移除了哪些元素?如何处理HTML5新标签的浏览器兼容问题?如何区分HTML和HTML5?
(1)HTML5现在已经不是SGML的子集,主要是关于图像,位置,存储,地理定位等功能的增加. 绘画canvas元素: 用于媒介回放的video和audio元素: 本地离线存储localStorage ...
- 【HTML5】如何处理HTML5新标签的浏览器兼容版问题
HTML5规范毕竟是刚刚才定义完成的规范,还有一些浏览器并不能支持其中的新标签和新属性,尤其是IE8及以下版本浏览器.以下介绍一些在页面中使用HTML5新标签的实践方法,目的是让HTML5中的新标签在 ...
- CSS伪类和伪元素
一.伪类 CSS伪类用于向某些选择器添加特殊的效果,在W3规范中,CSS伪类有如下几个: CSS2.1 :active:向被激活的元素添加样式(激活是指点击鼠标那一下) :focus:向拥有键盘输入焦 ...
- CSS 伪类 (Pseudo-classes)
CSS 伪类用于向某些选择器添加特殊的效果. CSS 伪类 (Pseudo-classes)实例: 超链接 本例演示如何向文档中的超链接添加不同的颜色. 超链接 2 本例演示如何向超链接添加其他样式. ...
- CSS伪类与CSS伪元素的区别及由来
关于两者的区别,其实是很古老的问题.但是时至今日,由于各种网络误传以及一些不负责任的书籍误笔,仍然有相当多的人将伪类与伪元素混为一谈,甚至不乏很多CSS老手.早些年刚入行的时候,我自己也被深深误导,因 ...
随机推荐
- 020.Dockerfile
docker-cli读取Dockerfile,根据指令生成定制的docker镜像. Dockerfile的指令根据作用可以分为两种,构建指令和设置指令. 构建指令:用于构建image,其指定的操作不会 ...
- [b0015] python 归纳 (一)_python组织方式
结论: xxx.yyyy yyyy 可以是 类.类对象.函数.变量 xxx 可以是 包.模块.类 代码: ref1.py # -*- coding: utf-8 -*- import os class ...
- 详解Vue的slot新用法
摘要: 理解Vue插槽. 作者:前端小智 原文:vue 2.6 中 slot 的新用法 Fundebug经授权转载,版权归原作者所有. 为了保证的可读性,本文采用意译而非直译. 最近发布不久的Vue ...
- idea把菜单栏给点没了...(File、Edit、View、Navigate.......)
第一种方法 找到idea的C盘的配置文件ui.lnf.xml文件 第二种方法 如果是高版本idea,我的是2019.3,双击shift选择Actions,搜索menu 然后重启idea
- 服务器学习--Linux、CentOS下安装zip与unzip指令
Linux下安装zip解压功能 Linux服务器上一般默认没是没有有安装zip命令 安装zip指令 apt-get install zip 或 yum install zip 输入zip OK li ...
- 其他综合-Kickstart无人值守安装系统CentOS 7
Kickstart无人值守安装系统CentOS 7 1.概述 1.1 关于PXE Preboot Execution Environment 翻译过来就是预启动执行环境:简称 PXE :传统安装操作系 ...
- js闭包和原型链好文
http://www.cnblogs.com/wangfupeng1988/p/3977924.html
- Maven 依赖范围 scope 属性详解
依赖范围就是用来控制依赖与三种 classpath(编译 classpath.测试 classpath.运行 classpath)的关系. 依赖范围(scope) 对于编译 classpath 有效 ...
- Appium+python自动化(三)- SDK Manager(超详解)
简介 本来宏哥一开始打算用真机做的,所以在前边搭建环境时候就没有下载SDK,但是由于许多小伙伴通过博客发短消息给宏哥留言说是没有真机,所以顺应民意整理一下模拟器,毕竟“得民心者,得天下”.SDK顾名思 ...
- AutoResetEvent介绍及使用场景
AutoResetEvent 允许线程通过发信号互相通信.通常,此通信涉及线程需要独占访问的资源. 线程通过调用 AutoResetEvent 上的 WaitOne 来等待信号.如果 AutoRese ...