一、选择符在运用在CSS设计样式时对HTML的指定有至关重要的作用!

二、研究
普通选择符:

1、类型选择符:它可以选择同一个类型的元素!

例如:h1,h2 {

             color:red;

            }

可以对多个元素同时选择!

2、属性选择符:它可以根据元素的属性去选择!可以做到任何,全选!

例如:* {

           color:red;

        }

3.类选择符/ID选择符:特殊的属性选择符

.a {

    color:red;

  }

#a {

     color:red;

   }

结构选择符:

1.包含选择符(后代选择符):div p ul li a{…}表示一个div中的p中的ul中的li中的a。~~~^_^~~~ 选择符之间的空格是至关重要的!

2.子选择符:子元素选择符仅仅能选择某个元素的直接子元素(嵌套多层的后代不能被选择),其基本形式是 选择符1>选择符2.

3.相邻选择符:相邻元素选择符顾名思义就是选择相邻的元素。其一般形式为 b+p(对下相邻,而不对上相邻)

4.兄弟选择符:b~p不强制紧邻,四海之内皆兄弟的意思!会选择b以下的所有p元素。

伪对象选择符:

1、first-letter {

                 效果

               }

这是针对文本第一个字的修改,注意此为块元素的属性,如果是行内元素需要转化为块元素之后方可使用。该伪类常被用来配合font-size属性和float属性制作首字下沉效果。

2、first-line {

                效果

             }

这是针对第一行文字的设置,同是块元素。

3、placeholder=” “

改变输入框中占位符的颜色

伪类选择器:

1、a:link {

             效果

           }

鼠标点击之前的状态

2、a:hover{

             效果

          }

鼠标放上去悬空时的状态

3、a:active {

            效果

            }

鼠标点击时的状态

4、a:visited{

             效果

             }

鼠标点击后的状态

5、a::selection {

             效果

             }

设置选中的效果,增加了用户体验!可在复制文字时使用!

html基本选择符的使用的更多相关文章

  1. CSS基础篇之选择符2

    属性选择符: 选择符 版本 描述 E[att] CSS2 选择具有att属性的E元素. E[att="val"] CSS2 选择具有att属性且属性值等于val的E元素. E[at ...

  2. CSS基础篇之选择符

    关系选择符 E F 包含选择符(Descendant combinator) CSS1 选择所有被E元素包含的F元素. <html> <head> <meta chars ...

  3. 30个你必须记住的CSS选择符

    所以你学会了基础的id,类和后代选择符,然后你就一直用它们了吗?如果是这样,你丢失了(css的)巨大的灵活性.在本文中提到的很多选择器属于CSS3规范的一部分,因此,只有在现代浏览器中才可使用. 1. ...

  4. DOM扩展-Selectors API(选择符 API)、元素遍历

    DOM扩展 对DOM的两个主要扩展是SelectorsAPI(选择符API)和HTML5 SelectorsAPI(选择符API)是由W3C发起制定的一个标准,致力于浏览器原生支持CSS查询,Sele ...

  5. CSS属性选择符

    属性选择符: E[att] 选择具有att属性的E元素. <style type="text/css"> a[class]{ background-color: red ...

  6. css选择符

    E>F:子选择符,选择所有作为E元素的子元素F.<style type="text/css">li>a {color: #ccc;}</style&g ...

  7. CSS高级选择符

    2016-11-07 <css入门经典>第八章 1.属性选择器 选择器 描述 [attribute] 用于选取带有指定属性的元素. [attribute=value] 用于选取带有指定属性 ...

  8. #8.10.16总结# 属性选择符 伪对象选择符 CSS的常用样式

    属性选择符 E[att] E[att="val"] E[att~="val"] E[att^="val"] E[att$="val ...

  9. CSS选择符详解

    一.类型选择符 什么是类型选择符?指以网页中已有的标签类型作为名称的行径符.body是网页中的一个标签类型,div,p,span都是. 如下: body {} div {} p {} span {} ...

随机推荐

  1. 上个项目的一些反思 I

    最近一直在反思之前的项目,发现了很多问题.比如数据安全... 虽然项目需求是只展示最新的数据,所以几乎没用什么本地存储.除了通讯录和用户的Token. 用户通讯录另表,今天反思下用户的Token的存储 ...

  2. python匹配ip正则

    python匹配ip正则 #!/usr/bin/env python # -*- coding:utf-8 -*- import re ip_str = "asdad1.1.1.1sdfwe ...

  3. jquery手写实现单页滚动导航

    效果说明:点击tab导航,页面滑动到下方相应板块.并且当页面通过鼠标滚动下去时,上方的tab也可以自动切换到当前位置的板块上. 代码说明:js中对两个动作分别写,一个是tab点击下滑到相应板块位置:一 ...

  4. WPF三大模板简介(Z)

    WPF三大模板简介   WPF支持以下类型的模板: (1) 控件模板.控件模板可以将自定义模板应用到某一特定类型的所有控件,或是控件的某一实例.决定控件外观的是ControlTemplate,它决定了 ...

  5. iOS开发UI篇—核心动画简介

    转自:http://www.cnblogs.com/wendingding/p/3801036.html iOS开发UI篇—核心动画简介 一.简单介绍 Core Animation,中文翻译为核心动画 ...

  6. Tensorflow 实现稠密输入数据的逻辑回归二分类

    首先 实现一个尽可能少调用tf.nn模块儿的,自己手写相关的function     import tensorflow as tf import numpy as np import melt_da ...

  7. Win10 Migrate apps to the Universal Windows Platform (UWP)

    https://msdn.microsoft.com/en-us/library/mt148501.aspx

  8. Sublime text 3安装Emmet

    这是Sublime text 3不是2的版本,两者的安装还是有区别的,下面的方法是我感觉比较简单的,其他的要命令什么的感觉太复杂了,经测试是OK的. 先关闭Sublime text 3: 第一步:下载 ...

  9. MySQL - 问题集 - "Got error 28 from storage engine"

    数据库的临时目录空间不够,修改配置文件中的tmpdir,指向一个硬盘空间很大的目录即可. windows下,找到配置文件my.ini. [mysqld] tmpdir=D:/work/tool/mys ...

  10. python excel操作

    python操作excel表格(xlrd/xlwt)转载:http://www.cnblogs.com/zhoujie/p/python18.html   最近遇到一个情景,就是定期生成并发送服务器使 ...