CSS Id 和 Class


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(1-1)样式表的更多相关文章

  1. css三种样式表写法

    css三种样式表:1.内嵌样式表: <head>  <style type="text/css">   样式表写法  </style> < ...

  2. web前端篇:CSS使用,样式表特征,选择器

    目录 web前端篇:CSS使用,样式表特征,选择器 1.CSS介绍 2.CSS使用 3.样式表特征 4.CSS选择器 5.选择器的优先级 6.练习题: web前端篇:CSS使用,样式表特征,选择器 1 ...

  3. CSS重构:样式表性能调优

    这两天窝在家里又看了本CSS相关的书:<CSS重构:样式表性能调优>.重构是指在不改变代码行为的前提下,重写代码,使其更加简洁.易于复用. 这本书读起来比较快,可挑自己感兴趣的读,前面三章 ...

  4. CSS 层叠及样式表来源

    Web标准化运动的口号——分离.分离.分离. 在2003年的 SXSW 会议中, Steve Champeon 和 Nick Finck 做了一个名为“面向未来的全方位 Web 设计”的演讲,揭示了这 ...

  5. CSS三种样式表

    1.外部样式表当样式需要应用于很多页面时,外部样式表将是理想的选择.在使用外部样式表的情况下,你可以通过改变一个文件来改变整个站点的外观.每个页面使用 <link> 标签链接到样式表. & ...

  6. css选择器,样式表导入

    css笔记1.选择器(selecter)共9种 a.类型选择器 p{},body{} b.后代选择器 p h1{} c.ID选择 #idname{} d.类选择 .classname{} e.通用选择 ...

  7. Normalize.css重置化样式表

    Normalize.css是一种CSS reset的替代方案.它在默认的HTML元素样式上提供了跨浏览器的高度一致性.相比于传统的CSS reset,Normalize.css是一种现代的.为HTML ...

  8. [19/06/05-星期三] CSS基础_样式表的位置(内联、内部、外部样式)、块元素(div)、内联元素(span)、常用的选择器

    一.概念 CSS(Cascading Style Sheets,层叠样式表) 可以用来为网页创建样式表,通过样式表可以对网页进行装饰. 所谓层叠,就是可以将整个网页想象成是一层一层的结构,层次高的将会 ...

  9. CSS 四种样式表 六种规则选择器 五种常用样式属性

    新的html程序要在VS中编写了,在vs中安装ASP.NET和Web开发,并用ASP.NET Web 应用程序(.NETFramework)创建一个网页程序.添加一个html页 后面的代码都是在htm ...

  10. css网页重置样式表(多版本)

    Eric reset.css html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, ...

随机推荐

  1. mysql 各类操作命令

    1.mysql 命令登陆 形式: mysql -u用户名 -p密码 mysql -uroot -proot 2.mysql 显示数据库 形式: show databases; 3.mysql 进入某一 ...

  2. EasyUI Parser 解析器

    Parser(解析器)应用场景 1,自动调用parser 只要我们书写相应的class,easyui就能成功的渲染页面,这是因为解析器在默认情况下,会在dom加载完成的时候($(docunment). ...

  3. WordPress修改标签云大小及颜色

    修改WordPress标签字体大小: 在cpanel面板中依次打开「wp-includes」→「category-template.php」,找到wp_tag_cloud, 1 2 3 4 5 6 7 ...

  4. 使用python读取word,写入execl

    word里面有2张表,需要找到第二张表,并写入execl中: 代码如下: #coding:utf-8 import os from docx import Document import win32c ...

  5. springMVC的异常处理

    1. 异常 什么是异常: 在程序中预期会出现,但是却无法处理的问题,叫做异常 异常处理原则: 延迟处理 先记着...,后续补充

  6. 元组tuple基本操作

    创建一个元组 tuple1=(1,2,3,4,5,6,7,8) tuple的标志仿佛是(),但是,有()不一定是元组,没有()不一定不是元组 tuple2=(1)#tuple2是一个整型 tuple3 ...

  7. 随记PC-win7 64位系统网络连接状态一直转圈、等待状态的异常解决方案

    各位看官好~ 最近电脑也做了下升级,入手个士必得360G的SSD来玩玩,顺便也下个新系统,看看有什么区别,想想顺便升级下系统也是好的,就开始了装机,装系统的路程~~~~~~ 好了不说废话,直接进入主题 ...

  8. JS图片更换还原操作,通过图片识别标识

    //图片更换还原操作,图片识别标识 如图片img.png 可换成 img2.png function img_biaoshi(caozuo,img_id, biaoshi) { var img_src ...

  9. 实现win的on程序数据更新

    枚举是一组描述性的名称定义一组有限的值,不包含方法对可能的值进行约束枚举是一组指定的常数,对可能的值进行约束枚举使用时直观方便.更易于维护 pictureBox控件属性名称    说明image    ...

  10. 代码中输入数字自动筛选出最大值,使用array,for loop and if (21.9.2017)

    # include <stdio.h> # define N main(){ int a, b; ,,,,,,,,,,,,,,,,}; //array中输入需要排序的数字 ]; ; a & ...