当前位置: 首页>前端>正文

css 样式选择器 大于某个索引 css选择器区分大小写吗

一.CSS样式规则

选择器{属性1:属性值1;属性2:属性值2;属性3:属性值3;}

属性与属性值以“键值对”的形式出现,属性是对通过选择器所指定的对象设置的样式属性(字体,大小,颜色等)。

CSS代码结构特点:

  • CSS样式中的选择器是严格区分大小写的,属性和值都不区分大小写(一般“选择器,属性,值”都采用小写形式)。
  • 多个属性之间必须用英文状态下的分号“;”隔开。(最后一个属性的分号可省略,最好不省略)。
  • 如果属性值有多个单词或多个字且中间有空格,则必须给这个属性值加上英文状态的引号。
  • CSS注释:/* CSS注释文本  */
  • 在CSS代码中空格是不能被解析的,大括号及分号前空格可有可无。因此可以使用空格键、Tab键、回车键等对样式代码进行排版(格式化CSS代码)。

二.引入CSS样式表

如果要使用CSS修饰网页,就需要引入CSS样式表。

1.行内式(内联样式):通过标记style标签来设置样式。

   <标签名 style="属性1:属性值1;属性2:属性值2">内容</标签名>

2.内嵌式:是指将CSS代码集中写在HTML文档的<head>头部,并用<style>标记。

  <head>

  <style type="text/css">

    选择器{属性1:属性值1;属性2:属性值2;}

  </style>

  </head>

  • style标记一般位于题head标记中title标记之后。(浏览器是自上而下解析代码,CSS代码放在头部以避免网页内容加载后没有样式修饰的尴尬)。
  • 设置type属性为“text/css”,是使浏览器知道style包含的是CSS代码。
  • 内嵌式CSS样式只对当前所在的HTML有效。

3.链入式:是指将所有的样式放在一个.css为扩展名的外部样式表文件中,然后再通过<link/>标记将外部样式表文件链接到HTML文档中。

  <head>

  <link href="CSS文件的路径" type=“text/css” rel="stylesheet"/>

  </head>

  • href:定义所链接的外部样式表的URL,可以是绝对路径也可以是相对路径。
  • type:定义所链接的外部文件的类型,指定为 “text/css”是表示外部链接的文件是CSS样式表。
  • rel:定义当前文档与所链接的文档之间的关系,指定为stylesheet表示被链接的是样式表文件。

链入式最大的好处就是一个CSS样式表可以被不同的HTML链接使用,一个HTML也可以链接多个CSS样式表。

三.CSS基础选择器

1.标记选择器:指用HTML标记名称作为选择器,为页面中某一类标记对应的元素指定统一的样式(body,p,h1,strong标记等)。

2.(class)类选择器:用“.”(英文点号)进行标识,后跟类名(类名第一个字符不能用数字,严格区分大小写)。    .类名{属性:属性值;}

3.id选择器:用“#”进行标识,后跟id名

4.通配符选择器:用“*”号表示,所有选择器中作用范围最广的,能作用到页面中所有元素。

5.标签指定式选择器(交集选择器):是由两个选择器组成的,第一个是标记选择器,第二个是id选择器或类选择器,两个选择器之间不能有空格。p#one

6.后代选择器:标记嵌套,外层标记写在前面,内层标记写在后面,中间用空格隔开。

7.并集选择器:如果某些选择器定义的样式完全相同或部分相同,便可以使用并集选择器定义;并集选择器就是各个选择器用英文逗号隔开。h2,h3,p,#one,.class1{属性:属性值;}




https://www.xamrdz.com/web/2es1924707.html

相关文章: