0

0

如何在 Bootstrap 5 中移除超链接默认下划线样式

碧海醫心

碧海醫心

发布时间:2026-01-31 17:23:09

|

794人浏览过

|

来源于php中文网

原创

如何在 Bootstrap 5 中移除超链接默认下划线样式

bootstrap 5 默认为所有 `` 标签添加了 `text-decoration: underline`,导致链接自动带下划线;可通过添加 `text-decoration-none` 工具类或自定义 css 轻松禁用。

在 Bootstrap 5 中,链接(<a> 元素)默认启用了下划线装饰(text-decoration: underline),这是与 Bootstrap 4 的一个重要变化——此前版本中仅在悬停时显示下划线,而 v5 默认始终显示。这一改动虽提升可访问性,但可能破坏原有设计风格。

推荐解决方案:使用 Bootstrap 内置工具类
为单个链接移除下划线,直接添加 text-decoration-none 类:

<a href="https://www.php.cn/link/93ac0c50dd620dc7b88e5fe05c70e15b" class="text-decoration-none">无下划线链接</a>

若需全局禁用(例如项目中所有链接均不加下划线),可在自定义 CSS 中覆盖默认样式(建议放在 Bootstrap 引入之后):

a {
  text-decoration: none !important;
}
/* 可选:恢复悬停下划线(保持交互提示) */
a:hover {
  text-decoration: underline !important;
}

⚠️ 注意事项:

一览妙笔
一览妙笔

自媒体、编剧、营销人员写作工具

下载
  • 避免滥用 !important;优先通过更具体的选择器(如 .nav-link, .btn-link)精准控制;
  • 从可访问性角度出发,建议至少保留悬停/聚焦状态的视觉反馈(如 text-decoration: underline 或 border-bottom);
  • 若使用 Sass 版本 Bootstrap,也可在 _variables.scss 中修改 $link-decoration 变量值,实现源头定制。

总结:text-decoration-none 是最轻量、语义清晰且响应式的解决方式,既符合 Bootstrap 5 的工具类设计理念,也便于团队协作与维护。

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

WorkBuddy
WorkBuddy

腾讯云推出的AI原生桌面智能体工作台

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
bootstrap框架介绍
bootstrap框架介绍

本专题整合了bootstrap框架相关介绍,阅读专题下面的文章了解更多详细内容。

74

2026.03.18

bootstrap安装教程
bootstrap安装教程

本专题整合了bootstrap安装相关教程,阅读专题下面的文章了解更多详细操作教程。

15

2026.03.18

Sass和less的区别
Sass和less的区别

Sass和less的区别有语法差异、变量和混合器的定义方式、导入方式、运算符的支持、扩展性等。本专题为大家提供Sass和less相关的文章、下载、课程内容,供大家免费下载体验。

216

2023.10.12

html边框设置教程
html边框设置教程

本教程将带你全面掌握HTML/CSS边框设置,从基础的border属性讲起,涵盖所有边框样式、圆角设置及高级技巧,帮助你快速上手实现各种边框效果。

44

2025.09.02

Python WebSocket实时通信与异步服务开发实践
Python WebSocket实时通信与异步服务开发实践

本专题聚焦 Python 在实时通信场景中的开发实践,系统讲解 WebSocket 协议原理、长连接管理、消息推送机制以及异步服务架构设计。内容包括客户端与服务端通信实现、连接稳定性优化、消息队列集成及高并发处理策略。通过完整案例,帮助开发者构建高效稳定的实时通信系统,适用于聊天应用、实时数据推送等场景。

5

2026.03.18

Java Spring Security权限控制与认证机制实战
Java Spring Security权限控制与认证机制实战

本专题围绕 Java 后端安全体系建设展开,重点讲解 Spring Security 在权限控制与认证机制中的应用实践。内容涵盖用户认证流程、权限模型设计、JWT 鉴权方案、OAuth2 集成以及接口安全防护策略。通过实际项目案例,帮助开发者构建安全可靠的后端认证体系,提升系统安全性与可扩展能力。

21

2026.03.18

抖漫入口地址合集
抖漫入口地址合集

本专题整合了抖漫入口地址相关合集,阅读专题下面的文章了解更多详细地址。

138

2026.03.17

多环境下的 Nginx 安装、结构与运维实战
多环境下的 Nginx 安装、结构与运维实战

本专题聚焦多环境下Nginx实战,详解开发、测试及生产环境的差异化安装策略与目录结构规划。深入剖析配置模块化设计、灰度发布流程及跨环境同步机制。结合监控告警、故障排查与自动化运维工具,提供全链路管理方案,助力团队构建灵活、高可用的Nginx服务体系,从容应对复杂业务场景挑战。

14

2026.03.17

PS 批量添加图片
PS 批量添加图片

本专题整合了PS批量添加图片教程合集,阅读专题下面的文章了解更多详细操作。

15

2026.03.17

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Sass 教程
Sass 教程

共14课时 | 1.0万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 3.7万人学习

CSS教程
CSS教程

共754课时 | 44.6万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号