Created
October 31, 2023 14:56
-
-
Save goish135/01c1e29b03e8ed6dcc45035de5cbe7a3 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<link rel="stylesheet" type="text/css" href="style.css"> | |
</head> | |
<body> | |
<div class="container"> | |
<div class="dot"> | |
<span class="word">PASS</span> | |
</div> | |
<div class="dot2"> | |
<span class="word">FAIL</span> | |
</div> | |
</div> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.dot { | |
width: 30px; | |
height: 30px; | |
background-color: #a0d911; /* Change the color to your preference */ | |
border-radius: 50%; | |
display: flex; | |
justify-content: center; | |
align-items: center; | |
box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); /* Optional shadow effect */ | |
margin-right: 10px | |
} | |
.dot2 { | |
width: 30px; | |
height: 30px; | |
background-color: #f5222d; /* Change the color to your preference */ | |
border-radius: 50%; | |
display: flex; | |
justify-content: center; | |
align-items: center; | |
box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); /* Optional shadow effect */ | |
} | |
.container { | |
display: flex; | |
/* 添加任何其他必要的样式 */ | |
} | |
.word { | |
color: #333; /* Change the text color to your preference */ | |
font-size: 16px; /* Change the font size to your preference */ | |
font-weight: bold; /* Optional font weight */ | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment