Canvas游戏计算机图形教程

时间:2024-04-19 17:38:32
TechbrooD

0首页

1简介

    1. 1.1WWW 技术变迁和生态
    2. 1.2WWW 学习建议
    3. 1.3WWW 互联网基础知识
    4. 1.4WWW Web
    5. 1.5 WWW Web 浏览器

    2HTML 基础知识

      1. 2.1 HTML 语法
      2. 2.2 HTML 块状元素(Block) 和 内联元素(Inline)
      3. 2.3 HTML 元素关系
      4. 2.4 HTML 语义
      5. 2.5 HTML 格式化
      6. 2.6 HTML 文档结构

      3HTML 文档内容

        1. 3.1 HTML 文本
        2. 3.2 HTML 内联
        3. 3.3 HTML 链接
        4. 3.4 HTML 图片
        5. 3.5 HTML 表格
        6. 3.6 HTML 结构
        7. 3.7 HTML 表单

        4CSS 基础知识

          1. 4.1 为什么需要 CSS
          2. 4.2 CSS 语法
          3. 4.3 CSS 选择器
          4. 4.4 CSS 继承
          5. 4.5 CSS 优先级
          6. 4.6 CSS 颜色 单位
          7. 4.7 CSS 尺寸 单位
          8. 4.8 CSS 样式重置
          9. 4.9 CSS 元素分类

          5CSS 文本

            1. 5.1 CSS 字体(font-family)
            2. 5.2 CSS 字体 属性
            3. 5.3 CSS 行高(line-height)
            4. 5.4 CSS 字体速写(shorthand)
            5. 5.5 CSS 文本 属性

            6CSS 框模型(BOX MODEL)

              1. 6.1 CSS 背景(background)
              2. 6.2 CSS 显示(display)
              3. 6.3 CSS 宽度和高度
              4. 6.4 CSS 边框
              5. 6.5 CSS 边框圆角
              6. 6.6 CSS 框阴影
              7. 6.7 CSS 内边距(padding)
              8. 6.8 CSS 外边距(margin)
              9. 6.9 CSS 尺寸速写和转盘规则

              7CSS 定位(POSITIONING)

                1. 7.1 CSS 文档流(Flow)
                2. 7.2 CSS 定位(position)
                3. 7.3 CSS 浮动(float)

                8CSS 排版上下文

                  1. 8.1 CSS FC概述
                  2. 8.2 CSS BFC(块排版上下文)
                  3. 8.3 CSS IFC(行内排版上下文)

                  9SVG入门

                    1. 9.1 SVG 概述
                    2. 9.2 SVG 一个例子
                    3. 9.3 SVG 在HTML中
                    4. 9.4 SVG 矩形
                    5. 9.5 SVG 圆形
                    6. 9.6 SVG 椭圆
                    7. 9.7 SVG 直线
                    8. 9.8 SVG 折线
                    9. 9.9 SVG 多边形
                    10. 9.10 SVG 路径
                    11. 9.11 SVG 文本
                    12. 9.12 SVG 描边

                    10JAVASCRIPT入门

                      1. 10.1 JS 基础语法
                      2. 10.2 JS BOM
                      3. 10.3 JS DOM
                      4. 10.4 JS CSS DOM
                      5. 10.5 JS 异步请求
                      6. 10.6 JS 原型式继承

                      11CSS3进阶

                        1. 11.1 CSS 伪类(pseudo-classes)
                        2. 11.2 CSS 伪元素(pseudo-elements)
                        3. 11.3 CSS 渐变(gradients)
                        4. 11.4 CSS 过渡(transitions)
                        5. 11.5 CSS 动画(animations)
                        6. 11.6 CSS 变换(transform)
                        7. 11.7 CSS 响应式(responsiveness)
                        8. 11.8 CSS GFC(网格排版上下文)
                        9. 11.9 CSS 网格布局概述(Grid Layout)
                        10. 11.10 CSS 网格布局基本术语
                        11. 11.11 CSS 显式网格布局
                        12. 11.12 CSS 隐式网格布局
                        13. 11.13 CSS 网格布局定位(Placement)
                        14. 11.14 CSS FFC(弹性排版上下文)
                        15. 11.15 CSS 弹性框布局概述(Flexbox Layout)
                        16. 11.16 CSS 弹性布局框模型和术语
                        17. 11.17 CSS 弹性容器(Flex Container)
                        18. 11.18 CSS 弹性项目(Flex Items)
                        19. 11.19 CSS 弹性布局的顺序和方向
                        20. 11.20 CSS 弹性行(Flex Lines)
                        21. 11.21 CSS 伸缩性(Flexibility)
                        22. 11.22 CSS 弹性布局对齐(Alignment)
                        23. 11.23 CSS 弹性布局分页(Pagination)

                        12HTML5进阶

                          1. 12.1 HTML5 画布(Canvas)概述
                          2. 12.2 HTML5 Canvas 2D渲染上下文
                          3. 12.3 HTML5 Canvas 绘制基本图形
                          4. 12.4 HTML5 Canvas 样式
                          5. 12.5 HTML5 Canvas 绘制文本
                          6. 12.6 HTML5 Canvas 擦除
                          7. 12.7 HTML5 Canvas 填满窗口
                          8. 12.8 HTML5 Canvas 绘图状态
                          9. 12.9 HTML5 Canvas 几何变换
                          10. 12.10 HTML5 Canvas 元素合成
                          11. 12.11 HTML5 Canvas 阴影
                          12. 12.12 HTML5 Canvas 渐变
                          13. 12.13 HTML5 Canvas 路径
                          14. 12.14 HTML5 Canvas 图像导出
                          15. 12.15 HTML5 Canvas 图像加载
                          16. 12.16 HTML5 Canvas 图像调整和裁剪
                          17. 12.17 HTML5 Canvas 图像变换
                          18. 12.18 HTML5 Canvas 图像像素数据访问
                          19. 12.19 HTML5 Canvas 绘制图像
                          20. 12.20 HTML5 Canvas 图像特效
                          21. 12.21 HTML5 Canvas 创建动画
                          22. 12.22 HTML5 Canvas 动画对象
                          23. 12.23 HTML5 Canvas 动画 圆周运动
                          24. 12.24 HTML5 Canvas 动画 碰撞检测
                          25. 12.25 HTML5 Canvas 动画 物理学知识
                          26. 12.26 HTML5 Canvas 动画 游戏
                          27. 12.27 HTML5 本地存储(Local Storage)
                          28. 12.28 HTML5 工作进程(Web Worker)
                          29. 12.29 HTML5 网页套接字(Web Socket)

                          13SVG进阶(滤镜和渐变)

                            1. 13.1 SVG 高斯模糊(Gaussian Blur)
                            2. 13.2 SVG 投影(Drop Shadow)
                            3. 13.3 SVG 线性渐变(Linear Gradient)
                            4. 13.4 SVG 径向渐变(Radial Gradient)

                            14ES6入门

                              1. 14.1 ES6 开发环境
                              2. 14.2 ES6 新特性详解
                              3. 14.3 ES6 新特性使用推荐

                              15REACTJS

                                1. 15.1 React Hello World程序
                                2. 15.2 React JSX
                                3. 15.3 React 组件
                                4. 15.4 React 事件
                                5. 15.5 React 状态

                                16WEB AUDIO API

                                  1. 16.1 Web Audio API 起步
                                  2. 16.2 Web Audio API 振荡器使用入门
                                  3. 16.3 Web Audio API 运行振荡器
                                  4. 16.4 Web Audio API 计时接口
                                  5. 16.5 Web Audio API 创建音效“类”对象
                                  6. 16.6 Web Audio API 使用录音
                                  7. 16.7 Web Audio API 滤波器介绍
                                  8. 16.8 Web Audio API 编后语
                                  踏得TechbrooD.com发现和展示WEB魔法

                                  我们依据最新的W3技术规范,采编相关技术博客和在线作品,结合商业项目实践经验来撰写这么一部使用HTML5技术编写的HTML5在线教程。 为了便于理解和记忆词汇的定义,我们采用中英文对照的方式。同时我们依托踏得网HTML5在线开发工具,采用用例驱动的方式来切实提高学习效率和实战能力。 我们采用迭代方式来开发这个教程,目前已完成基础部分(下面打勾的模块)。 
                                  参考链接:W3SchoolsMDNDevOpera。 
                                  任何问题请邮件到:24739149@qq.com

                                  WEB简介

                                  HTML5入门

                                  CSS3入门

                                  SVG入门

                                  JAVASCRIPT入门

                                  CSS3进阶

                                  伪类、渐变、过渡、变换和动画

                                  HTML5进阶

                                  CANVAS,WEB SOCKET,LOCAL STORAGE

                                  SVG进阶

                                  ES6

                                  JS开发框架

                                  REACTJS

                                  WEB动画API

                                  WEB音频API

                                  Copyright © 2017 TechBrood Co. All rights reserved.   沪ICP备14011478号