HTML 5 <span> 标签

标签定义及使用说明

<span> 用于对文档中的行内元素进行组合。

<span> 标签没有固定的格式表现。当对它应用样式时,它才会产生视觉上的变化。如果不对 <span> 应用样式,那么 <span> 元素中的文本与其他文本不会任何视觉上的差异。

<span> 标签提供了一种将文本的一部分或者文档的一部分独立出来的方式。

举例说明

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
</head>
<body>
<p>This is a paragraph <span style="color:#00ff00;">This is a paragraph</span>
This is a paragraph</p>
<p>我的母亲有 <span style="color:blue;font-weight:bold">蓝色</span> 的眼睛,我得父亲有 <span style="color:darkolivegreen;font-weight:bold">碧绿色</span> 的眼睛。</p>

</body>
</html>

运行结果

时间: 2024-10-08 12:54:48

HTML 5 <span> 标签的相关文章

使用&lt;span&gt;标签为文字设置单独样式

这一小节讲解<span>标签,我们对<em>.<strong>.<span>这三个标签进行一下总结: 1. <em>和<strong>标签是为了强调一段话中的关键字时使用,它们的语义是强调. 2. <span>标签是没有语义的,它的作用就是为了设置单独的样式用的. 如果现在我们想把上一小节的第一段话“美国梦”三个字设置成blue(蓝色),但注意不是为了强调“美国梦”,而只是想为它设置和其它文字不同的样式(并不想让屏幕阅读器

HTML &lt;span&gt; 标签

定义和用法 <span> 标签被用来组合文档中的行内元素. HTML 与 XHTML 之间的差异 NONE 提示和注释: 提示:请使用 <span> 来组合行内元素,以便通过样式来格式化它们. 注释:span 没有固定的格式表现.当对它应用样式时,它才会产生视觉上的变化. 例子 <p><span>some text.</span>some other text.</p> 例子解释 如果不对 span 应用样式,那么 span 元素中的

JS实现60s倒计时(亲测有效),及span标签如何使用和禁用onclick事件

效果如下图:点击按钮出现60秒倒计时,60s内按钮不可用,倒计时到了时间方可再次点击获取. 另外还有一个知识点,只有input 及button这样的表单元素有disbale属性,如何设置是否可用属性的方法一般用$("#id").attr('disbaled','true')及$("#id").prop('disbaled','false'),对span img这样的没有disbale的属性,这种方法就不起作用了,此时可用$("#id").setA

JQ和Js获取span标签的内容

html: 1 <span id="content">'我是span标签的内容'</span> javascript获取: 1 var content = document.getElementById("content").innerText; 2 var content = document.getElementById("content").innerHTML; jquery获取: 1 var cont=$(&quo

jQuery事件 mouseover方法与mouseout方法实现鼠标移进显示移出消失的效果 (css控制span标签)

<script> $(function(){ var text ; $(".pos span").each(function(){ text = $(this).text().trim(); if(text=="设为默认"){ $(this).css('display','none'); } }); $(".pos").mouseover(function(){ //鼠标移进显示效果 text = $(this).find('span

span标签换行

span{word-break:normal; width:auto; display:block; white-space:pre-wrap;word-wrap : break-word ;overflow: hidden ;} white-space -- 通过HTML文档的源代码的排版方式控制页面显示文本的排版方式 取值: normal | pre | nowrap | pre-wrap | pre-line | inherit normal: 正常无变化(默认处理方式.文本自动处理换行.

Div和Span标签显示与隐藏

本实例中,学习jQuery的知识,显示与隐藏网页上的div或是span标签. 实际环境中,也许是根据某些条件进行,符合条件时,对某个或是某个div或是span标签时行显示与隐藏. 主要是学习jQuery的函数与语法,在网页中放置一个铵钮,用户点一点隐藏或显示.还放置了一个div标签和一个span标签. 在asp.net mvc环境中进行,在控制中创建一个Action: 接下来创建一个视图(标记1): 标记2,在网页添加一个铵钮,value为“hide”,说明铵钮当前状态是show.标记3,添加d

display:block; 块级元素。&lt;a&gt;,&lt;span&gt;标签设置宽度和高度

display:block;是让对象成为块级元素(比如a,span等) 转化后 可以对a或者span标签进行width和height设置,否则设置不了 display有很多对象,具体可以参考http://www.w3school.com.cn/css/pr_class_display.asp 一般都是用display:none和display:block来控制层的显示

p标签中的span标签文字垂直居中对齐

<p>轻舞飞扬<span>第一次亲密接触</span></p> p标签的font-size:30px; span标签的font-size:24px; 让span标签垂直居中的方法: p>span{ display:inline-block; vertical-align:middle; } 基础知识需要牢记