一、选择符在运用在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. 【荐】PHP操作MongoDB GridFS 存储文件,如图片文件

    GridFS是MongoDB的一个内置功能,它提供一组文件操作的API以利用MongoDB存储文件,GridFS的基本原理是将文件保存在两个Collection中,一个保存文件索引,一个保存文件内容, ...

  2. H5项目常见问题及注意事项

    Meta基础知识: H5页面窗口自动调整到设备宽度,并禁止用户缩放页面 //一.HTML页面结构 <meta name="viewport" content="wi ...

  3. Alcatraz,

    今天重装Alcatraz,运行github上的命令后,安装成功,可是配置界面没出来. 无奈重装, 先删除原本的插件 rm -rf ~/Library/Application\ Support/Deve ...

  4. 【转载】实时监听输入框值变化的完美方案:oninput & onpropertychange

    oninput 是 HTML5 的标准事件,对于检测 textarea, input:text, input:password 和 input:search 这几个元素通过用户界面发生的内容变化非常有 ...

  5. 数据库分库分表(sharding)系列(一) 拆分规则

    第一部分:实施策略 数据库分库分表(sharding)实施策略图解 1. 垂直切分垂直切分的依据原则是:将业务紧密,表间关联密切的表划分在一起,例如同一模块的表.结合已经准备好的数据库ER图或领域模型 ...

  6. web应用 http 响应 url uri

    动态web  应用结构 WEB-INF --classes --lib web.xml     响应:   url   uri

  7. js中的事件委托或是事件代理详解

    起因: 1.这是前端面试的经典题型,要去找工作的小伙伴看看还是有帮助的: 2.其实我一直都没弄明白,写这个一是为了备忘,二是给其他的知其然不知其所以然的小伙伴们以参考: 概述: 那什么叫事件委托呢?它 ...

  8. (转)Tomcat7+Redis存储Session

    原创http://blog.csdn.net/caiwenfeng_for_23/article/details/45666831 PS:截止到2015-05-12前是不支持Tomcat8的,详情见官 ...

  9. 奇异值分解(SVD)和简单图像压缩

    SVD(Singular Value Decomposition,奇异值分解) 算法优缺点: 优点:简化数据,去除噪声,提高算法结果 缺点:数据的转换可能难于理解 适用数据类型:数值型数据 算法思想: ...

  10. [.NET]二维码生成

    又好一段时间没有写写东西了,继续回归原来的模式,多做记录,最近要实现个unity的二维码方面的功能,首先就要解决生成二维码的问题,这个倒是有这方面的组件,然后我通过强大的反编译工具Reflector( ...