为什么使用css样式来设置网页的外观样式呢？下面是一段文字，我们想把“超酷的互联网”、“服务及时贴心”、“有趣易学”这三个短语的文本颜色设置为红色，这时就 可以通过设置样式来设置，而且只需要编写一条css样式语句。

第一步：把这三个短语用<span></span>括起来。

第二步：写入下列代码：

span{

    color:red;

}

观察结果窗口文字的颜色是否变为红色了。

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>CSS样式的优势</title>

<style type="text/css">

span{

   color:red;

}

</style>

</head>

<body>

    <p>xx网，<span>超酷的互联网</span>、IT技术免费学习平台，创新的网络一站式学习、实践体验；<span>服务及时贴心</span>，内容专业、<span>有趣易学</span>。专注服务互联网工程师快速成为技术高手！</p>

</body>

</html>

效果:

CSS样式的优势的更多相关文章

  1. Web前端开发基础 第四课（认识CSS样式）

    CSS代码语法 css 样式由选择符和声明组成,而声明又由属性和值组成,如下图所示: 选择符:又称选择器,指明网页中要应用样式规则的元素,如本例中是网页中所有的段(p)的文字将变成蓝色,而其他的元素( ...

  2. CSS样式优先级

    关于CSS样式优先级 一般情况下: [1位重要标志位] > [4位特殊性标志] > 声明先后顺序 !important > [ id > class > tag ] 使用 ...

  3. [css]样式合并与模块化

    原文链接:http://www.zhangxinxu.com/wordpress/2010/07/css%E7%9A%84%E6%A0%B7%E5%BC%8F%E5%90%88%E5%B9%B6%E4 ...

  4. 在网页中插入CSS样式表的几种方法

    1. 链入外部样式表 链入外部样式表是把样式表保存为一个样式表文件,然后在页面中用<link>标记链接到这个样式表文件,这个<link>标记必须放到页面的<head> ...

  5. jQuery选择器ID、CLASS、标签获取对象值、属性、设置css样式

    jQuery是继prototype之后又一个优秀的Javascrīpt框架.它是轻量级的js库(压缩后只有21k) , 它兼容CSS3,还兼容各种浏览器 (IE 6.0+, FF 1.5+, Safa ...

  6. 前端之css样式（选择器）。。。

    一.css概述 CSS是Cascading Style Sheets的简称,中文称为层叠样式表,对html标签的渲染和布局 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. 例如 二.c ...

  7. css样式——选择器（三）

    https://www.cnblogs.com/haiyan123/p/7552235.html 1.怎么找到标签 2.如何操作标签的对象 一.css概述 CSS是Cascading Style Sh ...

  8. HTML引入CSS样式的四种方法

    在HTML中引入CSS的方法主要有四种,它们分别是行内式.内嵌式.链接式和导入式. 1.行内式          行内式是在标记的style属性中设定CSS样式.这种方式没有体现出CSS的优势,不推荐 ...

  9. WEB入门三 CSS样式表基础

    学习内容 Ø        CSS的基本语法 Ø        CSS选择器 Ø        常见的CSS样式 Ø        网页中3种使用CSS的方式 能力目标 Ø        理解CSS的 ...

随机推荐

  1. 几种任务调度的 Java 实现方法与比较Timer,ScheduledExecutor,Quartz,JCronTab

    几种任务调度的 Java 实现方法与比较 综观目前的 Web 应用,多数应用都具备任务调度的功能.本文由浅入深介绍了几种任务调度的 Java 实现方法,包括 Timer,Scheduler, Quar ...

  2. HDOJ 2026 首字母变大写

    Problem Description 输入一个英文句子,将每个单词的第一个字母改成大写字母. Input 输入数据包含多个测试实例,每个测试实例是一个长度不超过100的英文句子,占一行. Outpu ...

  3. ubuntu 下修改host文件

    原文地址:http://www.cnblogs.com/kingcat/archive/2012/02/23/2364509.html 有些时候,我们需要让某些域名指向本地,来实现调试,下面介绍下ub ...

  4. HDU 4751 Divide Groups 2013 ACM/ICPC Asia Regional Nanjing Online

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4751 题目大意:判断一堆人能否分成两组,组内人都互相认识. 解题思路:如果两个人不是相互认识,该两人之 ...

  5. lightoj 1251 (Two_Sat)

    #include<cstdio> #include<cstring> #include<iostream> #include<cmath> #inclu ...

  6. 二次战CPP链表

    Felling By Ruiy: Pre-learnning link list knowloages 熟悉 指针相关操作应用+结构体数据类型应用,且能简单融合使用,堆内存(内存泄露)->类似于 ...

  7. F - Prime Path

    题目大意: 素数路径 估计看数据就明白这道题什么意思了......给两个素数,都是四位数的素数,并且没有前导0,现在需要经过一种变换把一个素数转换成另一个,当然这种转换是有规则的,规则就是每次只能改变 ...

  8. Azkaban2配置过程

    Azkaban2配置过程 azkaban2所需环境:jdk1.6.ant.jetty.hadoop.ssl证书 通过http://azkaban.github.io/azkaban2/download ...

  9. composer安装第三方库

    生成composer.json 首先需要安装composer,composer -v出现如下,则表明安装成功. 编写composer.json { "name": "ww ...

  10. Redis 与 Memcached 的区别

    [转]Redis 与 Memcached 的区别 传统 MySQL + Memcached 架构遇到的问题     实际上 MySQL 是适合进行海量数据存储的,通过 Memcached 将热点数据加 ...