css右下角悬浮图标 |css 字体为宋体

/* CSS代码 */
.float{
	position: fixed;  /*设置定位为fixed*/
	right: 20px;  /*设置距离右侧20像素*/
	bottom: 20px;  /*设置距离底部20像素*/
	width: 50px;  /*设置宽度为50像素*/
	height: 50px;  /*设置高度为50像素*/
	background-color: #e74c3c;  /*设置背景颜色*/
	border-radius: 50%;  /*设置圆角*/
	text-align: center;  /*设置文字居中*/
	line-height: 50px;  /*设置行高为50像素*/
	color: #fff;  /*设置文字颜色*/
	font-size: 20px;  /*设置文字大小*/
	z-index: 999;  /*设置层级*/
}
.float:hover{
	background-color: #c0392b;  /*设置鼠标悬停后的背景颜色*/
	cursor: pointer;  /*设置鼠标悬停后的光标样式为手型*/
}

以上CSS代码可以实现一个红色的圆形悬浮图标。大家可以根据实际需求来调整它的大小、颜色和位置。

一些额外的CSS样式可以使悬浮图标更加引人注目。例如，大家可以使用动画效果添加一些交互性，也可以使用字体图标代替纯文本，以达到更好的视觉效果。

总之，使用CSS实现右下角悬浮图标是一个简单而实用的技巧，可以为您的网站增添不少活力。希望本文能够对您有所帮助。