Skip to content

G
game-stydy
Commit 8d4c067b authored by 邱旭's avatar 邱旭
Browse files
Options

01.一只鸟

parent 596498f7
Show whitespace changes
Inline Side-by-side
Showing with 77 additions and 0 deletions
01.一只鸟/01.一只鸟.html 0 → 100644
View file @ 8d4c067b
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"/>
<title>01.一只鸟</title>
<style>
html, body {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
overflow: hidden;
}
#bird {
/* 大小 */
width: 50px;
height: 50px;
/* 颜色 */
background-color: #f00;
/* 位置 */
position: absolute;
top: 50%;
left: 50%;
/* 旋转、缩放等属性 */
transform: scale(1, 1) rotate(45deg);
/* 锚点 */
transform-origin: center;
}
</style>
</head>
<body>
<div id="bird"></div>
</body>
</html>
01.一只鸟/01.一只鸟.md 0 → 100644
View file @ 8d4c067b
# 一只Bird
引入概念：`显示对象`
显示对象是游戏客户端渲染的基本对象，可理解为div
在body中插入一个div
```html
<div id="bird"></div>
```
把div放在你喜欢的位置，加上你喜欢的颜色
```css
#bird {
/* 大小 */
width: 100px;
height: 100px;
/* 颜色 */
background-color: #f00;
/* 位置 */
position: absolute;
top: 50%;
left: 50%;
/* 旋转、缩放等属性 */
transform: scale(1, 1) rotate(45deg);
/* 锚点 */
transform-origin: center;
}
```
经过一顿操作，我们得到了自己喜欢的一只Bird，如下图
![img.png](../images/01_1.png)
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment