认读小能手
body {
font-family: "Microsoft YaHei", sans-serif;
margin: 0;
padding: 0 20px;
background-color: #f0f9ff;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
box-sizing: border-box;
overflow: hidden;
}
body.show-result {
height: auto;
...
判断最简分数
body {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 95vh;
font-family: Arial, sans-serif;
transition: background-color 0.5s, color 0.5s;
}
h1 {
margin-bottom: 20px;
}
#main-container {
display: flex;
justify-content: space-between;
align-items: center;
...
一起来“通分”
body {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 95vh;
margin: 0;
background-color: #f0f8ff;
font-family: Arial, sans-serif;
}
h1 {
font-size: 2em;
color: #333;
margin-bottom: 30px;
}
.question-container {
display: flex;
justify ...
口算卡片
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Comic Sans MS', '楷体', '微软雅黑', sans-serif;
}
body {
background-color: #f0f8ff;
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
padding: 20px;
background-image: linear-gradient(to top, #fff1eb 0%, #ace0f9 100%);
...
极简格子
body {
margin: 0;
min-height: 100vh;
display: flex;
flex-direction: column;
background-image: linear-gradient(#ddd 1px, transparent 1px),
linear-gradient(90deg, #ddd 1px, transparent 1px);
background-size: var(--grid-size) var(--grid-size);
overflow: hidden;
}
.container {
flex: 1;
position: relative;
...
百数表，猜一猜，拼一拼
body {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
overflow: hidden;
margin: 0;
font-family: 'Comic Sans MS', '楷体', '微软雅黑',"Microsoft YaHei", Arial, sans-serif;
background-image: linear-gradient(to top, #fff1eb 0%, #ace0f9 100%);
}
.container {
display: flex;
flex-direction: row;
...
