id 和 class 选择器

如果你要在HTML元素中设置CSS样式,你需要在元素中设置"id" 和 "class"选择器。直线电机哪家好


id 选择器

id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。

HTML元素以id属性来设置id选择器,CSS 中 id 选择器以 "#" 来定义。

以下的样式规则应用于元素属性 id="para1":

实例

#para1 { text-align:center; color:red; }

尝试一下 »

 ID属性不要以数字开头,数字开头的ID在 Mozilla/Firefox 浏览器中不起作用。


class 选择器

class 选择器用于描述一组元素的样式,class 选择器有别于id选择器,class可以在多个元素中使用。

class 选择器在HTML中以class属性表示, 在 CSS 中,类选择器以一个点"."号显示:

在以下的例子中,所有拥有 center 类的 HTML 元素均为居中。

实例

.center {text-align:center;}

尝试一下 »

你也可以指定特定的HTML元素使用class。

在以下实例中, 所有的 p 元素使用 class="center" 让该元素的文本居中:

实例

p.center {text-align:center;}

尝试一下 »

 类名的第一个字符不能使用数字!它无法在 Mozilla 或 Firefox 中起作用。

 

CSS Id 和 Class的更多相关文章

  1. CSS id 选择器

    id 选择器 id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式. id 选择器以 "#" 来定义. 下面的两个 id 选择器,第一个可以定义元素的颜色为红色,第二 ...

  2. CSS Id 和 Class选择器

    CSS Id 和 Class选择器 如果你要在HTML元素中设置CSS样式,你需要在元素中设置"id" 和 "class"选择器. 一.id 选择器 id 选择 ...

  3. CSS:CSS Id 和 Class选择器

    ylbtech-CSS:CSS Id 和 Class选择器 1.返回顶部 1. CSS Id 和 Class id 和 class 选择器 如果你要在HTML元素中设置CSS样式,你需要在元素中设置& ...

  4. [HTML] CSS Id 和 Class选择器

    id 和 class 选择器 如果你要在HTML元素中设置CSS样式,你需要在元素中设置"id" 和 "class"选择器. id 选择器 id 选择器可以为标 ...

  5. CSS ID选择器(三)

    一.ID选择器 ID选择器使用"#"前缀标识符进行标识,后面紧跟指定的元素的ID名称. 如 #box{ width:100px; height:100px;} 元素的ID名称是唯一 ...

  6. CSS id 和 class 选择器

    如果你要在HTML元素中设置CSS样式,你需要在元素中设置"id" 和 "class"选择器. id 选择器 id 选择器可以为标有特定 id 的 HTML 元 ...

  7. CSS ID选择器&通配选择器

    ID选择器 ID(IDentity)是编号的意思,一般指定标签在HTML文档中的唯一编号.ID选择器和标签选择器.类选择器的作用范围不同. ID选择器仅仅定义一个对下对象的样式,而标签选择器和类选择器 ...

  8. css中使用id和class 的不同

    在 CSS 中,类选择器以一个点号显示: .center {text-align: center} 在上面的样例中,全部拥有 center 类的 HTML 元素均为居中. 在以下的 HTML 代码中, ...

  9. Scoped CSS规范草案

    原文链接:https://github.com/AlloyTeam/AlloyTouch/wiki/Scoped-CSS 写在前面 问:什么是Scoped CSS规范? Scoped CSS规范是We ...

随机推荐

  1. 理解CSV格式规范(解析CSV必备)

    什么是CSV逗号分隔值(Comma-Separated Values,CSV),其文件以纯文本形式存储表格数据(数字和文本),文件的每一行都是一个数据记录.每个记录由一个或多个字段组成,用逗号分隔.使 ...

  2. bzoj 2364

    传送门:http://www.lydsy.com/JudgeOnline/problem.php?id=2346 比较裸的最短路(' '     ) 水题又多了一道 #include <iost ...

  3. hdu 3060 Area2 (计算几何模板)

    Problem Description 小白最近又被空军特招为飞行员,参与一项实战演习.演习的内容还是轰炸某个岛屿(这次的岛屿很大,很大很大很大,大到炸弹怎么扔都能完全在岛屿上引爆),看来小白确实是飞 ...

  4. Python基础教程(008)--第一个Python程序

    前言: 学会第一个Python程序 了解Python2和Python3的区别 内容 执行Python程序的三种方式 解释器--Python.Python3 交互式-- ipthon 集成开发环境--P ...

  5. getjob

    [op@TIM getpage]$ cat job.py #coding: utf- #title..href... import urllib.request import time url=[ p ...

  6. Cococs2d-x学习路线

    |   版权声明:本文为博主原创文章,未经博主允许不得转载. Cocos2D-X推荐书: Cocos2d-x权威指南

  7. leetcode.矩阵.566重塑矩阵-Java

    1. 具体题目 给出一个由二维数组表示的矩阵,以及两个正整数r和c,分别表示想要的重构的矩阵的行数和列数.重构后的矩阵需要将原始矩阵的所有元素以相同的行遍历顺序填充.如果具有给定参数的reshape操 ...

  8. IDEA如何import一个新的项目

    首先解决依赖问题:打开pom.xml 2.打开File->setting 将里面的User setting file位置找到,放上settings.xml(注意要打开,将第一行位置改一下) 3. ...

  9. 12-vim-撤销和删除命令-02-删除文本

    删除文本 命令 英文 功能 x cut 删除光标所在字符 d(移动命令) delete 删除移动命令对应的内容 dd delete 删除光标所在行 D delete 从光标位置删除至行尾 注: 如果使 ...

  10. springCloud的使用01-----服务的注册和发现

    1 搭建eureka注册服务器 1.1 创建springboot项目,导入相应的jar包依赖 <project xmlns="http://maven.apache.org/POM/4 ...