登录  /  注册
两个span标签隐藏后再显示不在同一行_html/css_WEB-ITnose
php中文网
发布:2016-06-24 11:38:55
原创
1565人浏览过

最近在做树图,自己手写的,现在突然发现个问题,我在一行放置了两个span标签,前面是三角符号,后面是文字,这两个标签隐藏之后再次显示时第二个span换行了,我想可能是因为再次出现的时候被解析成了两个块级元素,在两个span中同时添加float:left,虽然没有明显换行,但是还是有错位,怎么破,以下是测试代码:
CSS:

.triangle-close{	display: inline-block;	width: 0;	height: 0;	border-left: 8px solid;	border-top: 4px solid transparent;	border-bottom: 4px solid transparent;}
登录后复制

HTML:
  • dddddd
登录后复制

JS:
function tt(){	var t = $(".theme").css("display");	console.log(t);	if(t == "none"){		$(".level1").children("span").css("display", "block");		$(".level1").children("span").css("float", "left");	}	else{		$(".level1").children("span").css("display", "none");	}	}
登录后复制

召唤一下各位大神:@蝶恋花雨 @苏小喵 @sysdzw @人生难得一只鸡 @豪情


回复讨论(解决方案)

inline: 指定对象为内联元素。
block: 指定对象为块元素。

span默认是内联元素,重新显示时也要设置为内联元素

function tt(){	var t = $(".theme").css("display");	console.log(t);	if(t == "none"){		$(".level1").children("span").css("display", "inline");	}	else{		$(".level1").children("span").css("display", "none");	}	}
登录后复制
登录后复制

inline: 指定对象为内联元素。
block: 指定对象为块元素。

span默认是内联元素,重新显示时也要设置为内联元素

function tt(){	var t = $(".theme").css("display");	console.log(t);	if(t == "none"){		$(".level1").children("span").css("display", "inline");	}	else{		$(".level1").children("span").css("display", "none");	}	}
登录后复制
登录后复制

忘记这回事儿了,多谢!


你css中设置的是inline-block
重新显示时也可以设置为inline-block
$(".level1").children("span").css("display", "inline-block");

或者用hide()和show()显示隐藏,这个会自动记录元素之前的显示状态

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
  • 蓝色极简风格律师事务所网站模板
  • 汉堡披萨快餐美食网站模板
  • 创意数字服务机构HTML5模板
网站特效
网站源码
网站素材
前端模板
关于我们免责申明意见反馈讲师合作广告合作技术文章
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2023//m.sbmmt.com/ All Rights Reserved | 苏州跃动光标网络科技有限公司 | 苏ICP备2020058653号-1

 | 本站CDN由 数掘科技 提供

登录PHP中文网,和优秀的人一起学习!
全站2000+教程免费学