Part One 可视化部分——Perceived and cognition

一、Visiual Perception

1、Constany:恒常性

2、相对值——感知系统基于相对判断，而非绝对判断

3、双目感知——真实世界

单目感知（Monocular Cue）—— 电脑屏幕（缺少三维信息）

4、Seeing Is Not Beliving

二、Cognition

1、conceptual interpretation affects memory

2、we rely on prior

三、Gestalt Theory(格式塔理论)

1、起源

2、内容

四、Color

1、人眼可以感受到的光谱范围为400nm~700nm

2、主要的色彩系统

RGB加色，CMYK、 RYB减色

【1】RGB Color Space

【2】HSL Color Space

【3】Lab Color Space

2、选色工具

ColorBrewer 网址

Part Two HTML & CSS

一、背景

1、编译语言 & 标记语言

2、HTML & CSS & JavaScript

二、环境配置

1、开发环境

【1】Node.js：能够在服务器端运行JS；跨平台的JS运行环境；https://nodejs.org/zh-cn/

【2】NPM：Node.js自带的包管理工具；更换淘宝源；npm config set registry —— http://registry.npm.taobao.org/

2、编辑器推荐

【1】VS Code：小巧清爽；适用于各种语言的代码编辑；免费

【2】Webstorm：重量IDE（集成开发环境）；功能强大；集成对应语言的各类插件

三、HTML入门

1、HTML简介

• HTML : Hyper Text Markup Language (超文本标记语言)
• HTML 不是一种编程语言，而是一种标记语言 (markup
language)
• 标记语言是一套标记标签 (markup tag)，用来描述网页

超文本：
•超越文本限制：可以加入图片、声音、动画、多媒体等内容
•超级链接文本：可以从一个文件跳转到另一个文件，与世界各地
主机的文件连接

2、HTML结构

3、HTML入门

【1】HTML标签

HTML标签分为两种等级：块级元素和行内元素

块级元素：独占一行，不能与其他任何元素并列；能接受宽高，如果不设置宽度，那么宽度将默认变为父级的100%；

如<div></div>、 <p></p>

行内元素：与其他行内元素并排；不能设置宽高，默认的宽度就是文字的宽度；如：<a></a> 、<b></b>、<span></span>

【2】SVG简介

三、CSS入门

1、CSS简述

2、CSS选择器

3、CSS引入方式和样式覆盖

4、CSS样式属性

DAY 2 Perceived and cognition || HTML CSS 入门相关推荐

CSS入门之引用、选择器、属性（六分之三）
CSS 入门教程六分之三篇没办法,我直播教小伙伴CSS入门,属性讲完,准备说定位的时候,他们就喊停,hold不住了...所以先写到六分之三,23333333 要点解释引用如何使用定义的CSS样 ...
html 布局兼容性,HTML+CSS入门浏览器兼容性问题及解决方案
本篇教程介绍了HTML+CSS入门浏览器兼容性问题及解决方案,希望阅读本篇文章以后大家有所收获,帮助大家HTML+CSS入门. < 问题一:不同浏览器的标签默认的外补丁和内补丁不同问题现象: ...
【转载】CSS 入门精要（一）
本教程取名为"入门精要",首先是为入门读者准备的,如果你想在本文中找到关于CSS的高级知识,请绕行!其次,"精要"二字表明本文只讲述关于CSS的入门要点,力求精 ...
vue 导入公共css_HTML+CSS入门 vue引入通用CSS
本篇教程介绍了HTML+CSS入门 vue引入通用CSS,希望阅读本篇文章以后大家有所收获,帮助大家HTML+CSS入门. < 1.在入口 js 文件 main.js 中引入,一些公共的样式文件 ...
css实现图片虚化_HTML+CSS入门如何实现背景图片虚化效果
本篇教程介绍了HTML+CSS入门如何实现背景图片虚化效果,希望阅读本篇文章以后大家有所收获,帮助大家HTML+CSS入门. < 需求:一个div设置了background: url,现在需要 ...
css 高度塌陷_HTML+CSS入门 HTML高度塌陷以及定位详解
本篇教程介绍了HTML+CSS入门 HTML高度塌陷以及定位详解,希望阅读本篇文章以后大家有所收获,帮助大家HTML+CSS入门. < 高度塌陷的含义: 父元素的高度,默认被子元素撑开,目前来讲 ...
html纵向的跑马灯效果,HTML+CSS入门如何实现跑马灯/走马灯效果
本篇教程介绍了HTML+CSS入门如何实现跑马灯/走马灯效果,希望阅读本篇文章以后大家有所收获,帮助大家HTML+CSS入门. < 实现跑马灯的方法很多,其中最简单的是采用一句Html代码来实 ...
html css入门经典 pdf,CSS入门经典
<CSS入门经典>是2008年清华大学出版社出版的图书,作者是(美国)(RichardYork)约克.[1] 书名 CSS入门经典作者 (美国)(RichardYork) ...
html css导航栏字体图标,HTML+CSS入门之两种图标字体库
本篇教程介绍了HTML+CSS入门之两种图标字体库,希望阅读本篇文章以后大家有所收获,帮助大家HTML+CSS入门. < ## 0. 前言比较基础的图标加载:和块元素的背景background ...
doc文件转换html,HTML+CSS入门如何使用POI将doc文件转换为HTML
本篇教程介绍了HTML+CSS入门如何使用POI将doc文件转换为HTML,希望阅读本篇文章以后大家有所收获,帮助大家HTML+CSS入门. < 需要的jar包有:有一些是依赖包,可以使用ma ...

DAY 2 Perceived and cognition || HTML CSS 入门