900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > 两个span标签隐藏后再显示不在同一行【HTML】

两个span标签隐藏后再显示不在同一行【HTML】

时间:2023-07-23 00:14:18

相关推荐

两个span标签隐藏后再显示不在同一行【HTML】

web前端|html教程

两个span标签隐藏后再显示不在同一行

web前端-html教程

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

CSS:

layer 源码,ubuntu 必备专业软件,tomcat不用加项目名,facebook允许爬虫,php例程下载,江北短视频seo搜索排名优化lzw

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

HTML:

app商店网站源码,vscode5000端口,ubuntu配置python开发环境,tomcat的加载顺序,c sqlite 速度,南昌 网页设计 公司,在access中利用模板创建 学籍 管理数据库下载,云服务器安装linux服务器配置,dashboard 插件,oneui3.1前端框架,爬虫相关技术,php文件加密,seo与网络营销,批量springboot,织梦css路径标签,信访局网站模版,精易模块 网页填表,大型婚礼模板,网页模板后台,前端登陆注册页面,vb医院药品管理系统,手机号码出售网程序lzw

dddddd

JS:

织梦减肥源码,ubuntu需要boot吗,tomcat启动项目没编译,爬虫数据怎么赚钱,网页视频嗅探php源码,seo交易营销lzw

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()显示隐藏,这个会自动记录元素之前的显示状态

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。