请问哪里不对?

请问哪里不对?

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
<title>text-overflow</title>
<style type="text/css">
p { width: 500px;font-size:20px; margin: 10px auto; background: #abcdef;}
/*此处写代码*/
.p1{text-overflow: ellipsis;}
.p2{text-overflow: ellipsis;}
</style>
</head>
<body>
<p class="p1">bababadalgharaghtakamminarronnkonnbronntonne,rronntuonnthunn,trovarrhounawnskawntoohoohoordenenthurnuk</p>
<p class="p2">bababadalgharaghtakamminarronnkonnbronntonne,rronntuonnthunn,trovarrhounawnskawntoohoohoordenenthurnuk</p>
</body>
</html>


正在回答 回答被采纳积分+1

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

2回答
好帮手慕慕子 2019-11-09 00:01:31

同学你好, inherit是指继承父级元素的属性值,这里p的父元素是body, 所以是继承body元素的overflow属性默认值visible, 表示内容不会被修剪,会呈现在元素框之外哦,达到鼠标移入的时候文字内容完整显示的效果

如果帮助到了你, 欢迎采纳,祝学习愉快~~~

  • 提问者 神知 #1
    这么晚没睡啊。谢谢。
    2019-11-09 00:02:34
好帮手慕慕子 2019-11-08 10:18:07

同学你好, 因为text-overflow属性需要结合overflow:hidden;属性一起使用才可看到效果,所以无法实现效果

然后, 根据练习要求第二个P标签的文本溢出需要被修剪掉, 鼠标移入要显示全部的文字内容哦,示例:可以在鼠标移入的时候使用inherit属性值恢复默认的样式

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

同学可以自己下去再测试一下哦

如果帮助到了你, 欢迎采纳,祝学习愉快~~~

  • 提问者 神知 #1
    hover里的inherit继承的是哪个样式呢?p不是溢出隐藏了吗
    2019-11-08 21:40:15
问题已解决,确定采纳
还有疑问,暂不采纳

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

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

0 星

相似问题

登录后可查看更多问答,登录/注册

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

在线咨询

领取优惠

免费试听

领取大纲

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