前端入门篇(三十)logo导航栏问题记录,前端开发必看

本文介绍了前端开发中关于logo导航栏的一些常见问题及解决方案,包括在无图片时显示文字、清除浮动、列表横放等技巧。此外,还强调了JavaScript在前端开发中的重要性,建议通过不断学习和实战提升技能。附带一份全面的前端学习资料供读者获取。
摘要由CSDN通过智能技术生成

或者:.header-logo .test

3.实现:有加载css时不显示图片背后的文字,无css时显示文字

在背景图片上加跳转链接时,有时遇到网络不佳,不能显示图片,此时为了确保用户依然可以跳转页面,会备份写文字,让用户点击文字处跳转,如下:

在这里插入图片描述

用户点击“官网链接”完成页面跳转

但是如果只是简单写在链接对应位置,效果很丑,如:

html文件:

官网链接

效果:

在这里插入图片描述

解决办法:设置超大的负缩进

html文件不变

css文件:

.header-logo a.lr{

text-align: center;

text-indent: -99992em;

}

效果:

有加载到css

  • 12
    点赞
  • 19
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值