正在阅读下面文章的是一个七岁的孩子,你该如何表达才能让他理解以下技术内容?(费曼学习法)
你这篇文章要解决的最重要问题是什么?
出版时间:2011年
这本书的结构
- Part I: Getting Started
- Part II: The HTML Elements
- Part III: Cascading Style Sheets
- Part IV: Working with the DOM
- Part V: Advanced Features
Part I: Getting Started
这一部分介绍的内容,是为了让我们能够顺利阅读这本书。
C1-5我最关心&我还不知道的问题
- 可以为元素添加自定义属性(author defined attributes) data-*
- HTML 元素之间的关系:Parents, Children, Descendants, Siblings
- HTML 规范将元素分成的类型:metadata, flow, phrasing
- 常用的 HTML 实体:<
<
, >>
, &&
, €€
, ££
, §§
, ©©
, ®®
, ™™
- 全局属性回顾:contenteditable, accesskey, autocapitalize, autofocus, data-*, dir, draggable, enterkeyhint, exportparts, hidden, inert, inputmode, is, itemid|itemtype|itemscope, itemprop, itemref, nonce, part, slot, spellcheck, tabindex, title, translate
- CSS At-rules: @charset, @import, @color-profile, @container, @counter-style, @font-face, @font-feature-values, @font-palette-values, @keyframes, @layer, @media, @namespace, @page, @supports
- 样式层叠规则:内联 >
<style>
><link rel="stylesheet">
> 用户样式 > 浏览器样式;可使用!important
改变优先级 - Specificity:id values+other attributes+element names
- Inheritance:元素的可继承与不可继承
- CSS angle units
- parseInt, parseFloat
- unshift:在数组开头插入新元素
Part II: The HTML Elements
该部分主要关注 HTML。
C6-15我关心&我还不知道的问题
- <noscript>, <br>/<wbr>, <var>(<code>,<kbd>,<samp>), <abbr>, <dfn>, <q>/<blockquote>, <cite>, <ruby>/<rt>/<rp>, <ins>/<del>, <time>
Part III: Cascading Style Sheets
这部分关注 CSS。
C16-24我关心&我还不知道的问题
- :empty
-
常用元素的默认 display 值
- img: inline
-
全部属性
-
边框和背景
-
background
- *-attachment
- *-clip
- *-color
- *-image
- *-origin
- *-position
- *-repeat
- *-size
-
border
- *-bottom/top/left/right
- --color
- --left-radius
- --*-style
- --*-width
- *-color
- *-image
- box-shadow
-
outline
- *-color
- *-style
- *-width
- *-offset
-
-
盒子
- box-sizing
- clear
- display
- float
- height/width/max-/min-
- margin/padding
- overflow
- visibility
-
布局
- top/right/bottom/left
- position
- column-*
- display
- flex
- grid
-
文本
- @font-face
- direction
- font
- letter-spacing
- line-height
- text-*
- word-spacing
-
过渡、动画和变化
- @keyframes
- animation
- transform
- transition
-
Part IV: Working with the DOM
这一部分主要关注文档对象模型(DOM),它的作用是——连接 HTML 内容和 JS。
C25-31我关心&我还不知道的问题
- Document 的一些实例属性:documentURI, forms, lastModified
- Location, Window, History, Screen, HTMLElement
- CSSOM: CSSStyleDeclaration
Part V: Advanced Features
这一部分涉及 Ajax、多媒体、Canvas、Drag&Drop、Geolocation、Web Storage、Offline Web App。