关于text-decoration属性继承的问题

关于text-decoration属性继承的问题

老师讲text-decoration属性不会继承,但是实际中的效果不就是继承吗?

http://img1.sycdn.imooc.com//climg/5bc125ac0001d23810710353.jpg

比如这是代码,我没有对span设置任何内容,但是结果span依旧会显示下划线和上划线,同时还有颜色变成了红色,这么做的原因不就是因为继承吗?

老师说这不是继承,这是因为其也是p标签的内容,但是其已经添加了span,所以我觉得他应该是属于span而非p,就像之前的举border不能继承的例子一样。所以,我感觉这个属性是可以继承的呀。

正在回答

登陆购买课程后可参与讨论,去登陆

4回答

你好同学,text-decoration的属性是设置在外层p标签的,由于p标签包裹了span标签,所以会出现span内容的部分也有样式,这个不是继承来的哦~

http://img1.sycdn.imooc.com//climg/5bc2b6aa0001aaa105750479.jpg

通过在span标签上设置text-decoration属性为none,定义为标准的文本,其效果是没有变化的,

祝学习愉快!

  • 宝慕林842399 提问者 #1
    对不起老师,我现在有一点晕了,我现在有三个疑问。 第一:这个p元素不是span标签的父元素吗?span标签继承了p标签的样式所以它才会显示和p标签一样的css样式啊。如果按照老师的讲法,是因为span标签在p标签的里面,所以他才会有和p标签一样的内容,那这么讲的话,我们不就不需要有继承这个概念了吗,因为继承就是继承父元素,而子元素肯定在父元素的里面呀。 第二:当你给span标签设置text-decoration属性为none时,为什么其效果会没有变化呢?按理说这个时候用行内样式给span标签设置样式,这个的权重是100,肯定比继承的权值大呀。 第三:如果我要想为"css层叠样式表"设置样式,让"css"为红色,让"css层叠样式"为蓝色,应该怎么设置呢?
    2018-10-20 10:49:17
  • 妮可妮可妮_ 回复 提问者 宝慕林842399 #2
    你好同学,text-decoration属性是作用在p标签上的,span标签并没有继承其属性,p标签是span标签的父元素,会将span的内容包裹进去,所以会出现上述效果,继承举个栗子:父元素设置了字体大小,不需要给子元素设置字体大小,子元素就会在父元素继承到相同的字体大小的设置,而text-decoration属性并不会继承,span标签处也没有该属性,当给span标签设置text-decoration属性为none时,因为span标签本来就没有继承到text-decoration属性,就是默认的标准文本,所以不会有变化
    2018-10-22 09:32:46
  • 宝慕林842399 提问者 #3
    奥,谢谢老师,我终于明白了,如果他要是继承的话,那么说他是由text-decoration,下划线样式的,那么我们现在用行内样式给它设为none,他应该是无下划线了才对,可是现在发现它依旧有下划线,说明它其实是原本就没有样式的。
    2018-11-02 14:16:00
Carol246 2018-10-25 16:26:26

这个属性是不可以继承的,可以对比下面这两个图来理解:


(1)父元素设置了下划线,而span标签没有设置下划线

http://img1.sycdn.imooc.com//climg/5bd17dd30001e93d06230063.jpg

(2)span标签设置了下划线

http://img1.sycdn.imooc.com//climg/5bd17dd300015e0606180064.jpg


  • 提问者 宝慕林842399 #1
    明白了,一针见血,如果是继承的话,那么span标签的下划线应该是蓝色的,可是现在是红色的,这说明其是父元素的下划线,只不过span标签的内容也在父元素内而已。
    2018-11-02 14:18:15
汪晓歌 2018-10-18 22:30:24

妮可老师回答的是对的!

咖啡色的自由3984265 2018-10-14 00:22:22

这个是属于块模型里面的内容,具体的你可以去看张鑫旭写的《CSS世界》里面第三章的内容,讲的比较清楚。

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
前端小白入门系列课程
  • 参与学习           人
  • 提交作业       11218    份
  • 解答问题       36713    个

从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师