首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

用TAOBAO方法隐藏多余线条

偶然看到了TAOBAO UED团队BLOG,在上面看到了篇文章,说是怎么隐藏导航最后一项竖线 1、类目之间横竖线 从很久很久以前开始,类目间竖线无非都只有三种。...1、背景图 在a标签设置一个padding 用宽1px高不等背景图来position到右侧。 缺点:最后一个还是要用class来隐藏掉背景。 2、符号 在每个a标签之间用”|”符号来填充。...3、a标签右侧boder。 同背景图一样,只不过使用border-right来代替。缺点也同上。 看到这里,可能已经有人打开淘宝首页用firebug查看源码来看是怎么做了。...其实现有是利用uloverflow:hidden 再将limargin-left:-1px做法做出来。这样做法就可以同时避免以上缺点了。 其实这种方法我们可以在很多地方都用到,比如

636100
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    文字溢出隐藏以及和flex冲突问题

    在某些段落中,页面要求文字只显示一行,但是width固定,而文字过长,就会出现一个需求,超过长度限制文字隐藏且显示省略号,css 支持这样属性。...单行文本溢出隐藏 div{ overflow: hidden;   white-space: nowrap;   text-overflow: ellipsis; } 多行文本溢出隐藏 div {...但是有一个我们需要注意地方!! flex布局是前端写代码经常使用一种布局方式,简单便捷且有效,但是在使用flex布局元素中不能同时使用文字溢出隐藏,也就是两者不能同时出现在同一标签中。...这里,我们也有对应解决办法。 只要保证flex布局和隐藏样式不在同级元素中就可以,所以在文字外部多包裹一层标签。 可以采用下面这段代码写法;      <!

    1.7K10

    css3 属性 text-overflow 实现截取多余文字内容 以省略号来代替多余内容

    css3 属性 text-overflow: ellipsis 前言 正文 结束语 前言 公众号:前端印象 不定时有送书活动,记得关注~ 关注后回复对应文字领取:【面试题】、【前端必看电子书】、【数据结构与算法完整代码...】、【前端技术交流群】 我们在设计网站时候有时会遇到这样一个需求:因为页面空间大小问题,需要将多余文字隐藏起来,并以省略号代替,类似这样效果: ?...100px; white-space: nowrap; /*使文本内容不换行,写在一行*/ overflow: hidden; /*隐藏多余内容...100px; white-space: nowrap; /*使文本内容不换行,写在一行*/ overflow: hidden; /*隐藏多余内容...*/ text-overflow: ellipsis; /*将多余内容以省略号方式展示*/ } 效果图 ?

    1K10

    图片内容管家 (把文字隐藏到图片里)

    下载地址) 功能简介: 一款颇具创意javafx应用软件。 可以在图片放入和编辑: 电影下载链接、电影番号、学习资料网址、告白情诗、记录心情笔记等。 支持链接一键在浏览器打开,支持内容导出。...对内容进行加密,并支持对图片密码设置,提高安全性。 软件截图: 1 打开图片 支持拖拽 可以直接拖拽至主界面左侧,图片位置。..., 在迅雷开启情况下回自动响应。...3 浏览器响应 一键打开 如果是可用浏览器打开链接,后面会有一个浏览器图标, 点击该按钮,即可一键用浏览器打开该链接。...4 添加内容 方便贴心 输入文本后,按下回车键或者右侧“新建内容”按钮, 即可添加内容。 5 双击编辑 简单方便 双击对应内容即可编辑。

    3.4K20

    如何巧妙去除隐藏“站长统计”文字链接?

    站长统计没有自带隐藏前台“站长统计”文字功能,这2字在我们页面中时而多余时而碍眼,所以90%以上用户都会想办法去除或隐藏“站长统计”四个字。...ID为你网站统计ID,有2处要修改,分别是id='cnzz_stat_icon_5844924'和stat.php%3Fid%3D5844924,把5844924修改成你网站统计id就可以了。...增加一段js隐藏站长统计文字链接 在获取统计代码最后,也就是前面,加一段: document.getElementById("cnzz_stat_icon_xxxxxxx").style.display...= "none"; 在保存前记得修改站点统计ID,将xxxxxxx修改为你站长统计网站统计ID即可。...参考:如何巧妙去除隐藏“站长统计”文字链接? 版权所有:可定博客 © WNAG.COM.CN 本文标题:《如何巧妙去除隐藏“站长统计”文字链接?》

    2.1K20

    WordPress移除head头部js、css、feed等多余加载项

    在我们开发WordPress主题时,细心小伙伴或发现网站头部如果加载head页面就会出现很多系统自带加载项目,例如自带css、js、feed、style等多余信息。...这些加载项目很多是没有必要加载,那么我们如何将这些多余head头部信息移除呢? 方法很简单,网上针对此类WordPress优化教程也很多,今天WPTOO教程网就给大家整理下。...我们先看看移除多余加载项之前代码截图 解决方法 //去除头部多余加载信息 remove_action( 'wp_head', 'wp_generator' );//移除WordPress版本 remove_action...rest_output_link_wp_head', 10 ); //移除wp-json remove_action( 'wp_head', 'print_emoji_detection_script', 7 ); //头部JS...head头部是不是少了很多多余加载项信息? 下面是精简后代码截图 ?

    2.6K20
    领券