当鼠标点击字上之后变色加粗，点其他的又变为原样怎么设css

2025-03-02 10:02:06

推荐回答（5个）

回答1：

当鼠标点击字上之后变色加粗，点其他的又变为原样，是设置错误造成的，解决方法如下：

1、首先就是打开Sublime Text编辑器，新建一个HTML页面，并添加HTML结构，如下图所示。

2、然后在body区域添加字体，注意放在一个div里面，如下图所示。

3、接下来就可以在CSS中用font-weight进行加粗设置了，只需要设置bold就可以了，如下图所示。

4、另外font-weight还可以被设置为从100到900的数值，数字越大越粗，如下图所示。

5、最后当font-weight被设置为100的时候，字体是最细的，如下图所示。

回答2：

思路如下：为文字的变色加粗设置一个class，当某个元素被点击就应用此class，其他元素就移除此class。下面给出实例演示：

创建Html元素


	点击对象后设置字体样式，同时取消其他对象的此样式：

	
		我是span中的文字。
		我是个p。

		list-item

设置css样式

div.box{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}
div.box span{color:#999;font-style:italic;}
div.content{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}
li{margin:10px 0;padding:10px 0;}
.selected{font-weight:bold !important; color:red !important;}

编写jquery代码

$(function(){
	$("body").click(function(e) {
		$("*").removeClass('selected');    // 先删除所有元素的selected样式
		$(e.target).addClass('selected');  // 然后为被点击元素添加selected样式
	});
})

观察效果

初始样式
点击第一个span的效果
接着点击最后一个li的效果

回答3：

用javascript就可以，基本代码在下面，你自己照着改吧

回答4：

hover变色

第一块

第二块

第三块

第四块

第五块

回答5：

这个你要用的 JS 写了，通过一个事件，进行加粗，在点其他的时间后，取消之前事件的加粗,