## 尚硅谷前端全套，撸一遍
## html+css 共148课时，讲师李立超
## 1介绍，软件分系统软件，应用软件，游戏软件，客户端就是客人，服务器就是厨子，服务器开发语言有很多，nodejs是一种辅助的开发语言，客户端是网页（bs）、文字界面、图形化界面（cs），bs不用安装，跨平台（成本低啊，只开发一套），不用更新
## 2网页历史，英国一个爵士，94年发明了万维网（W3C），1991年8月6日，第一个服务器和第一个网站在欧洲核子研究中心上线,网页需要结构表现行为，html+css+js三剑客
## 3html简介，超文本标记语言，所谓的超文本就是超链接，纯文本就是全是内容，富文本就是还可以打扮打扮，写代码都是纯文本，建议使用Chrome
## 4编写你的第一个网页，第一个我都忘了...标签尖括号和单词，元素就是加上中间的东西<a></a>这是一对双标签而<a>lalal</a>这是一个元素，每一个标签都有自己的作用
## 5安装编辑器，我这里有vscode，里面还装了一堆插件
## 6自结束标签和注释，<br/> <!-- -->不能嵌套，所有语言的注释都是不能嵌套的
## 7标签中的属性比方说<a href="http://www.baidu.com">百度一下</a>名值对，一个名字与一个值，很多属性有默认的值，多个属性使用空格隔开
## 8文档声明，头上那个<!DOCTYPE html>这就是h5，使用标准模式渲染
## 9进制...尚硅谷就喜欢给大家打基础，什么课都有啊，计算机2进制，用16进制表示，方便看，我们用10进制
## 10字符编码...符号转成2进制的过程中需要一个密码本，编码和解码用的规则，小本本就会字符集，ascII是7位，ISO-8859-1是8位，中国GBK和GB2312统一用Unicode,包括UTF-8,1-5位，UTF-16，2-4位，UTF-32,4位
## 11文档的使用，这节课教了手写html文档，从声明开始写，然后教了查文档，前期可以去w3c，后期可以去mdn
## 12vscode的安装，这玩意挺好，免费的，有丰富的插件
## 13配置一个liveServer插件
## 14实体字符，用的不多，上网上搜就行，© ><
## 15meta标签，稍微特殊一点，设置网页的元数据，里面可以写20多种，一大堆的，这个不需要我们写
## 16语义化标签<h1>大标题</h1><title>标题</title>h2-h6<p>段</p><em>强调</em><blockquote>引用</blockquote><q>短引用</q>
## 17块级与行内，块级放行内，行内不能块级，换行与否，这节课讲了f12
## 18结构化语义标签<header>头部</header><footer>脚</footer><main>主要内容</main><aside>侧边栏</aside><nav></nav><article>文章</article><section>文章</section><div>一块</div><span>行内元素，一般是文字</sapn>
## 19列表<ul><li>有序列表的一项</li></ul><ol><li>无序列表的一项</li></ol><dl><dt>定义内容</dt><dd>解释</dd></dl>
## 20超链接，跳转页面，跳位置<a href="##name1" target="_blank">链接</a><a name="name1"/>
## 21相对路径，./当前路径 ../上级
## 22锚链接，就是上面那个name="name1"加上href="#name1"这么个玩意，一般是用id不是name，直接是##是跳转到顶部
## 23图片标签<img src="url"/>这属于行内块，专业点讲就是替换元素！这个img被一个src里面那个图替换了，alt='图片来不了就上文字' width、height
## 24图片格式，jpeg、png、gif，最后一个可以动，颜色单一，透明jpg不支持，png支持、gif勉强，大小上来讲，png比jpeg大，最后还有webp，优点全部具备，就是不兼容，base64是做小图片的，减少请求，大小偏大，与网页一起加载的图片才会用
## 25内联框架<iframe src="" name=""></iframe>
## 26音频audio标签属性有autoplay、controls、loop、width、height、src,为了兼容问题，里面包上source然后每个source里面放一个src，实际上得是从网上链接，因为占带宽，占磁盘，都是找第三方，甚至可以从腾讯视频的分享那里把播放器和视频都拿过来
## 27css介绍，层叠样式表，层叠就是优先级的意思
## 28编写位置，行内，内联，外联
## 29基本用法，选择器{属性:属性值;}
## 30常用选择器类选择器，id选择器，标签选择器，通配符选择器
## 31复合选选择器，交集选择器，并集选择器
## 32关系选择器，后代选择器，~，+
## 33属性选择器，[name]前面没写相当于*[name]，属性值也可以指定[name='zs'],甚至是[name^='z'][name$='s'][name*='zs']
## 34伪类选择器，:first-child :nth-of-child(2n) :not(:last-child) nth-of-type(3-n)
## 35超链接选择器，:link :visited :active :hover ---lvah
## 36伪元素选择器，::after ::before ::first-letter ::first-line ::selection
## 37练习......http://flukeout.github.io/，通关，无敌
## 38继承，就是后代继承父元素的样式，部分可以继承，字体相关可以继承，在mdn上面都有
## 39权重，发生冲突时按照权重来算，1000，100，10，1，内联、id、类、标签
## 40像素和百分比，px是物理像素，百分比就是天然的响应式
## 41em和rem，前面这个是根据字体大小来的，后面是根据html的字体大小来的，后面这个可以通过js去控制
## 42rgba红绿蓝不透明度，rgb就是不加这个a，16进制两位一个颜色红绿黄##ff4400,rgb(255,0,134),rgba(1,2,4,0.9)
## 43hsl和hsla，这个a还是不透明度，这是工业设计里面用的，色相，饱和，度亮度0-255
## 44文档流，元素有文档流和脱标，行内独占一行，行内就像写字一样，宽高有内容撑开
## 45盒模型，content+padding+content+border
## 46边框，border:1px solid blue;
## 47内边距，padding:10px 10px 10px 10px;上右下左，一个参数是4方，两个是上下+左右，三个是上+左右+下
## 48外边距，margin:10px;单独一个方向就是margin-left:10px;左边left右边right，上边top下边bottom
搜索css diner
