<span> 标签被用来组合文档中的行内元素。

如果不对 span 应用样式,那么 span 元素中的文本 与 其他文本不会有任何视觉上的差异。尽管如此,上例中的 span 元素仍然为 p 元素中增加了额外的结构。

HTML:

<p class="tip"><span>提示:</span>... ... ...</p>

CSS:

p.tip span { font-weight:bold; color:#ff9955; }

事实上,您也许已经注意到了,W3School 站点上有一些文本的样式与其他文本是不同的。

比如“提示”使用了粗体的橘红色。尽管实现这种效果的方法非常多,但是我们的做法是:

使用“提示”使用 span 元素,然后对这个 span 元素的父元素,即 p 元素应用 class,这样就可以对这个类的子元素 span 应用相应的样式了。

<span> 标签的更多相关文章

  1. embed标签loop=true背景音乐无法循环

    在html网页中加入背景音乐并设置为循环播放.一开始用<embed>标签,设置loop="true", 但是结果发现在IE浏览器可以,但是在chrome浏览器却无法实现 ...

  2. 【转】object标签和embed标签

    我们现在大部分人做网页,都是直接用DW插入flash,而且DW也是所见即所得,直接生成了相应的flash显示代码.可是我们又有多少人了解这些直接由DW生成的代码呢?其实我接触flash player标 ...

  3. embed标签的使用(在网页中播放各种音频视频的插件的使用)

    播放器插件使用说明: 代码:< EMBED src=“music.mid”autostart=“true”loop=“2”width=“80”height=“30”> src:音乐文件的路 ...

  4. as3.0 [Embed]标签嵌入外部资源

    1.[Embed]嵌入资源 ActionScript代码的顺序非常重要.你必须在声明变量前添加[Embed]元数据标签,而且这个变量的类型会是Class; package { import flash ...

  5. 解决embed标签显示在div上层【转藏】

    解决embed标签显示在div上层,非设置z-index 今天给屌炸了爆笑网增加了视频栏目,但是发现在IE8中,顶部浮动导航的div在移动到embed视频上时,总是被embed的flash文件盖住.分 ...

  6. OBJECT和EMBED标签(转载)

    一.介绍: 我们要在网页中正常显示flash内容,那么页面中必须要有指定flash路径的标 签.也就是OBJECT和EMBED标签.OBJECT标签是用于windows平台的IE浏览器的,而EMBED ...

  7. 转: object 和embed 标签播放flash

    一.介绍: 我们要在网页中正常显示flash内容,那么页面中必须要有指定flash路径的标 签.也就是OBJECT和 EMBED标签.OBJECT标签是用于windows平台的IE浏览器的,而EMBE ...

  8. OBJECT和EMBED标签

    一.介绍: 我们要在网页中正常显示flash内容,那么页面中必须要有指定flash路径的标 签.也就是OBJECT和EMBED标签.OBJECT标签是用于windows平台的IE浏览器的,而EMBED ...

  9. HTML 5 <embed> 标签

    定义和用法 <embed> 标签定义嵌入的内容,比如插件. 实例 <embed src="helloworld.swf" />

  10. chrome不支持embed标签解决方案

    <!DOCTYPE html> <html> <head> <title></title> <meta http-equiv=&quo ...

随机推荐

  1. 【cs229-Lecture2】Gradient Descent 最小二乘回归问题解析表达式推导过程及实现源码(无需迭代)

    视频地址:http://v.163.com/movie/2008/1/B/O/M6SGF6VB4_M6SGHJ9BO.html 机器学习课程的所有讲义及课后作业:http://pan.baidu.co ...

  2. JS-缓冲运动基础结构

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. Android 请求运行时权限

    写文件到sd卡中,会报权限问题,需要动态申请申请运行时权限 1. MainActivity.java public class MainActivity extends Activity { priv ...

  4. Promise {<pending>

    场景:在create-react-app whatwg-fetch的项目中,想获取请求返回的数据, componentWillMount() { console.log(this.props) con ...

  5. ELK系列六:Logstash的Filter模块

    Date过滤 input { stdin{ codec => plain } } filter { date { match => ["message", " ...

  6. EF---延迟加载技术

    延迟加载: 优点:只在需要的时候加载数据,不需要预先计划,避免了各种复杂的外连接.索引.视图操作带来的低效率问题 使用方式:两步 第一:在需要延迟加载的属性前加上virtual ,该属性的类型可以是任 ...

  7. Java Agent初探——动态修改代码

    用了一下午总算把java agent给跑通了,本篇文章记录一下具体的操作步骤,以免遗忘... 通过java agent可以动态修改代码(替换.修改类的定义),进行AOP. 目标: ? 1 为所有添加@ ...

  8. jquery如何让checkbox如何取消勾选

    1.取消勾选 $("checkbox").attr("checked", false); 2.勾选 $("checkbox").attr(& ...

  9. Nginx防止恶意域名解析

    为了防止别人恶意将大量域名解析到自己的网站上面.我们可以对nginx做防止恶意域名解析,这样就只能通过自己的域名访问网站,其他域名就会显示错误500 打开Nginx配置文件nginx.conf,在原来 ...

  10. VS远程调试亲历

    背景: 很多情况下本地开发没有问题,可放到服务器就有问题(更气人的是测试环境时也行可就是生产环境不行!) 1.想到可能是服务器环境不对,Web服务器版本不对 2.有文件读写是不是文件夹权限 3.Web ...