當前位置：首頁 > 编程资源 > 综合教程 >内容正文

综合教程

css怎么去掉下划线(menu横向菜单栏中去掉下划线)

發布時間：2023/12/24 综合教程 41 生活家

生活随笔收集整理的這篇文章主要介紹了 css怎么去掉下划线(menu横向菜单栏中去掉下划线) 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

本文操作環境：windows10系統、css 3、thinkpad t480電腦。

可以使用text-decoration 屬性來取消文本下劃線，該屬性規定添加到文本的修飾，下劃線、上劃線、刪除線等。

基本語法：


/*關鍵值*/
text-decoration: none;                     /*沒有文本裝飾*/
text-decoration: underline red;            /*紅色下劃線*/
text-decoration: underline wavy red;       /*紅色波浪形下劃線*/
/*全局值*/
text-decoration: inherit;
text-decoration: initial;
text-decoration: unset;

登錄后復制

屬性值：

none 默認。定義標準的文本。
underline 定義文本下的一條線。
overline 定義文本上的一條線。
line-through 定義穿過文本下的一條線。
blink 定義閃爍的文本。
inherit 規定應該從父元素繼承 text-decoration 屬性的值。

（學習視頻分享：css視頻教程）

代碼示例如下：


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>風君子博客（php.cn）</title> 
<style>
h1.under {
    text-decoration: underline;
}
h1.over {
    text-decoration: overline;
}
p.line {
    text-decoration: line-through;
}
p.blink {
    text-decoration: blink;
}
a.none {
    text-decoration: none;
}
p.underover {
    text-decoration: underline overline;
}

</style>
</head>

<body>
<h1 class="under">下劃線</h1>
<p class="line">刪除線</p>
<p class="blink">閃爍效果，但瀏覽器不會顯示</p>
<h1 class="over">下劃線</h1>
<p>這是一個 <a class="none" href="#">鏈接</a>，默認情況下鏈接是有下劃線的，這邊我們移除它。</p>
<p class="underover">上劃線與下劃線</p>

</body>

</html>

登錄后復制

總結

以上是生活随笔為你收集整理的css怎么去掉下划线(menu横向菜单栏中去掉下划线)的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。

上一篇： html如何设置删除线(CSS如何设置图
下一篇：华为p30pro的耳机插孔在哪里(华为技