电脑技术网——专业手机电脑知识平台,关注科技、手机、电脑、智能硬件
HTMLCSSHTML5Bootstrap

如何采用HTML span标签的class属性?这里有关于class属性的编纂者

2020-02-03 20:45:27 出处:[ 菜菜电脑网 ] 人气:次阅读
本篇文章主要为大家描写的就是关于HTML span标签的class属性的一些用法,这个是并不需要定位css样式一起来常用的,现在可以稍微话说点css样式的基本,对有过基础的人来说都很很难。那现在于是就我们一起来刚才这篇文章吧

首先我们来就让关于HTML span标签的class属性的意思:

span英文为跨度 的意思,但是在网页制作中它是html标签的一种零碎标签为<span></span>

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

class在html中用来定义标签的样式,可重复利用,针对各不相同的标签它可以定义长方形很低以及背景颜色等等...

例如、<span class="main"></span>,其中main为class名字在css意在"."同步进行定义

往下看发展:

这有一个例子:

<p><span>some text.</span>some other text.</p>

例子的推论在这:

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

可以为 span 应用领域 id 或 class 属性,这样既可以减少须要的语义,又便于对 span 技术的发展样式。

可以对同一个 <span> 元素广泛应用 class 或 id 属性,但是更相似的情况是只应用领域其中一种。这两者的主要差异是,class 常用元素组(多种不同的元素,或者可以解释为某一类元素),而 id 用做标识单独的唯一的元素。

若有:事实上,您也许已经注意到了,W3School 站点上有一些文本的样式与其他文本是相异的。比如“指引”运用于了括弧的橘红色。尽管借助于这种效果的方法非常多,但是我们的处理方式是:用到“定时”应用于 span 元素,然后对这个 span 元素的父元素,即 p 元素应用于 class,这样就可以对这个类的子元素 span 广泛应用可视的样式了。

这是HTML中的代码:

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

这是CSS中的代码:

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

就这样,一个有趣的css属性,突显span标签的分析方法,就能让一个标签应用领域到别的标签元素中去,这样就是css样式的好处之一,用着只需。

再来一个基本的HTML span标签的class实例:

<!DOCTYPE html><html><head><meta charset="utf-8"> <title>PHP中文网(php.cn)</title><style>span.intro {color:blue;}p.important {color:green;}</style></head><body><span class="intro">标题 1</span><p>段落。</p><p class="important">留意:这是一个很不可或缺的段落。 :)</p></body></html>

就图中能解读多少,这也是一个很比较简单的网页,舍弃了点css样式,就能把整个样式施工单位。比如把字体颜色改以蓝色了。

就不想如图:

tuyi.png

好了,以上就是关于HTML span标签的class属性的详述。有问题可以在下方发问。

【小编力荐】

HTML中的base标签如何撰写相对路径?(内附常用引介)

HTML img标签的src属性的用法是什么?就其适用方法解析(内附实例)

以上就是如何适用HTML span标签的class属性?这里有关于class属性的包罗万象的简略内容,更多劝关切php中文网其它无关文章!

关于我们 - 广告合作 - 联系我们 - 免责声明 - 网站地图 - 投诉建议 - 在线投稿

©CopyRight 2008-2020 caicaipc.com Inc All Rights Reserved.
菜菜电脑网 版权所有 联系QQ:173533152