一，效果图。

二，代码。

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <title>CSS id和class选择器</title>

    <style>

    #para1 {

        text-align: center;

        color: red;

    }

    .center {

        text-align: center;

    }

    p.center {

        text-align: right;

    }

    </style>

</head>

<body>

    <p id="para1">hello</p>

    <p>this paragraph is not affected by the style.</p>

    <h1 class="center">标题居中</h1>

    <p class="center">段落居中</p>

</body>

</html>

参考资料：《菜鸟教程》

【代码笔记】Web-CSS-CSS id和Class选择器的更多相关文章

  1. Python学习笔记整理总结【web基础】【web/HTML/CSS/JavaScript/DOM/jQuery】

    一.HTML HTML是英文Hyper Text Mark-up Language(超文本标记语言)的缩写,他是一种制作万维网页面标准语言(标记).相当于定义统一的一套规则,大家都来遵守他,这样就可以 ...

  2. 零基础学WEB前端-CSS

    CSS指层叠样式表(Cascading Style Sheets),CSS 是标准的布局语言,用来控制元素的尺寸.颜色.排版.CSS 由 W3C 发明,用来取代基于表格的布局.框架以及其他非标准的表现 ...

  3. WEB前端 CSS(非布局)

    目录 WEB前端 CSS CSS引入方式 CSS结构 CSS选择器 直接选择器 组合选择器 分组选择器 也叫并集选择器 属性选择器 伪类选择器 伪元素选择器 CSS选择器是一个查找的过程,高效的查找影 ...

  4. 《编写高质量代码：Web 前端开发修炼之道》 笔记与读后感

    编写高质量代码:Web 前端开发修炼之道/曹刘阳著. —北京:机械工业出版社,2010.5 第一版 涉及到的知识点: 1. CSS Sprites 在国内很多人叫css精灵,是一种网页图片应用处理方式 ...

  5. CSS3基础——笔记+实战案例(CSS基本用法、CSS层叠性、CSS继承性)

    CSS3基础——笔记 CSS是Cascading Style Sheet的缩写,翻译为"层叠样式表" 或 "级联样式表".CSS定义如何显示HTML的标签央视, ...

  6. CSS3学习笔记-1：CSS样式继承

    自己在写css时总会遇上css样式继承的问题,好在一般问题不大,但一直也不明白css样式继承的规则,最近发现了一篇文章讲的不错,因此转载过来: 所谓CSS的继承是指被包在内部的标签将拥有外部标签的样式 ...

  7. Web云笔记--CSS

    CSS CSS CSS Web自学第二阶段之CSS 参考资料:<Head First HTML&CSS>(中文第二版)(美国)弗里昂ISBN:9787508356464 中国电力出 ...

  8. 写给自己的web总结——css篇（1）

    上一篇写了关于html的知识,算是小试牛刀,这次来尝试写一下css. 初步了解css css的全称为cascading style sheet-- 层叠样式表,通过编入代码来对html里的标签做出各种 ...

  9. Web前端-CSS必备知识点

    Web前端-CSS必备知识点 css基本内容,类选择符,id选择符,伪类,伪元素,结构,继承,特殊性,层叠,元素分类,颜色,长度,url,文本,字体,边框,块级元素,浮动元素,内联元素,定位. 链接: ...

随机推荐

  1. 高级Java面试总结1

    一.三大框架方面问题   1.Spring 事务的隔离性,并说说每个隔离性的区别 解答:Spring事务详解 2.Spring事务的传播行为,并说说每个传播行为的区别 解答:Spring事务详解 3. ...

  2. FFmpeg 结构体学习(五)： AVCodec 分析

    在上文FFmpeg 结构体学习(四): AVFrame 分析我们学习了AVFrame结构体的相关内容.本文,我们将讲述一下AVCodec. AVCodec是存储编解码器信息的结构体.下面我们来分析一下 ...

  3. [Swift]LeetCode301. 删除无效的括号 | Remove Invalid Parentheses

    Remove the minimum number of invalid parentheses in order to make the input string valid. Return all ...

  4. [Swift]LeetCode413. 等差数列划分 | Arithmetic Slices

    A sequence of number is called arithmetic if it consists of at least three elements and if the diffe ...

  5. [Swift]LeetCode939. 最小面积矩形 | Minimum Area Rectangle

    Given a set of points in the xy-plane, determine the minimum area of a rectangle formed from these p ...

  6. 工作随笔—Java容器基础知识分享（持有对象）

    1. 概述 通常,程序总是运行时才知道的根据某些条件去创建新对象.在此之前,不会知道所需对象的数量,甚至不知道确切的类型,为解决这个普遍的编程问题:需要在任意时刻和任意位置创建任意数量的对象,所以,就 ...

  7. LongAdder 测试

    import org.slf4j.Logger;import org.slf4j.LoggerFactory; import java.util.concurrent.CountDownLatch;i ...

  8. windows服务器解决挖矿程序问题

    前几天发现服务器报警,cpu使用率已达100%,查资料知道正是最近比较流行的挖矿程序在捣鬼.我们使用的是阿里云的服务器,操作系统是windows server.网上有大量的资料讲如何处理,我把自己处理 ...

  9. Django+Bootstrap+Mysql 搭建个人博客（一）

    1.1.环境搭建 (1)虚拟环境 mkvirtualenv website pip install django==1.11.7 (2)创建项目和app:website和blog (3)设置中文set ...

  10. 使用QuertZ组件来搞项目工作流（一）

    前言:抛弃windows计划,拥抱.NET组件.每个人都喜欢监听和插件.今天,几乎下载任何开源框架,你必定会发现支持这两个概念.监听是你创建的C#类,当关键事件发生时会收到框架的回调.例如,当一个作业 ...