JQuery中劃線是CSS的一個屬性,被用于在文本中添加下劃線或刪除線。下面是一個使用JQuery CSS中劃線的簡單示例:
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("p").css("text-decoration", "underline");
});
});
</script>
</head>
<body>
<h2>使用jquery中劃線的示例</h2>
<p>這是一個普通的段落。可以用CSS為其添加下劃線:</p>
<button>給段落添加下劃線</button>
</body>
</html>
上面的示例將為按鈕添加一個單擊事件,并將CSS屬性text-decoration設置為underline使段落中的文本顯示下劃線。您也可以設置其他文本裝飾,如overline(上劃線)和line-through(刪除線)。
對于好奇心強的人,下面是一個更高級的示例,它演示如何使用JQuery和CSS將下劃線添加到鏈接并在鼠標懸停時更改下劃線顏色:
<html>
<head>
<style>
a{text-decoration:none;color:#008CBA;}
a:hover{text-decoration:underline;color:#FF0000;}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("a").hover(function(){
$(this).css("text-decoration", "underline");
},function(){
$(this).css("text-decoration", "none");
});
});
</script>
</head>
<body>
<h2>使用jquery中劃線的示例</h2>
<p>下面的鏈接將在懸停時變為藍色下劃線</p>
<a href="#">這是一個鏈接</a>
</body>
</html>
上面的示例演示了如何使用CSS創建一個鏈接,然后使用JQuery添加了下劃線到鏈接并在鼠標懸停時更改下劃線顏色。這是一種非常常見的技術,用于增強網頁上的鏈接的可見性。