2017 October 17

HTML/CSS实战总结--慕课网

位置：慕课网——课程——前端开发——HTML/CSS

已学：

1.HTML+CSS基础课程 
2.企业网站综合布局实战（慕课网首页）
3.CSS进行网页布局
4.导航条菜单的制作（差最后两个，JS实现有问题啊？？？？？）
5.H5、CSS3扁平化博客
6.重拾CSS的乐趣
7.CSS动画实用技巧（看了一点？？？？）
8.CSS雪碧图应用
9.分页页码制作
10.DOM探索之基础详解篇(待看？？？？)
11.回到顶部
12.用字体在网页中画icon图标  （动画 很厉害哦~）
13.手把手教你实现电商网站开发  （待写？？？）
14.从psd到HTML (待写？？？)
15.H5+JS+CSS3实现七夕言情  (待看？？？？)
16.表单美化（下拉 遮罩增有问题，没调好啊？？？？？）
17.数学知识在CSS动画中的应用
18.手风琴效果
19.JS实现京东无延迟菜单效果（待研究，自己没写好？？？？？？）
20.图片预加载(讲得特别好！！！)
21.css圆角进化论（代写）
22.DatePicker组件开发(很多知识点啊)
23.Handlebars模板引擎
24.星际评分原理和实现（三有问题3.2？？，3.3？？）
25.帝都抢车位动画制作
26.网页简单布局之结构与表现原则

web安全 XSS
浅谈搜索引擎SEO
W3Ctech走进名企 小米专场
2016腾讯前端技术大会


（nodejs）
基于websocket的火拼俄罗斯（基础）
前端性能优化-通用的缓存SDK

基于websocket的火拼俄罗斯（单机版）
基于websocket的火拼俄罗斯（升级版）

----------------
IT菜鸟逆袭指南


网页简单布局之结构与表现原则


SEO在网页制作中的应用（搜索引擎优化）

-----------------
float
CSS深入理解之absolute 
CSS深入理解之absolute（待写）
CSS深入理解之overflow（待看）
line-height
vertical-align
relative
margin
padding
border

清除浮动——

clearfix的用法：http://www.imooc.com/wenda/detail/11604

ps 切图：

1.png图片:

选中要切出来的图层，在图层上右键，转换为智能对象。然后用选中工具框选出区域，ctrl+c，ctrl+n（新建图层），

ctrl+v，然后保存为web常用格式，完成！

2.jpeg图片

找到图层后，框选出要切的位置区域，图像–剪裁–保存即可

：first-child：选择列表中的第一个 <li> 元素并设置其样式：
li:first-child

{
	background:yellow;
}

：after{

content:"";

display:block;

clear:both;

}

:before{
	content:"";
}

轮播图库：myFocus

font图标：icomoon官网

获取当前滚动的高度：document.documentElement.scrollTop

document.body.scrollTop;

如果 input 元素中输入的值为合法的，设置其为黄色:
input:valid
{ 
background-color: yellow;
}

如果 input 元素中的值是非法的，设置样式为红色：
input:invalid
{ 
border:2px solid red;
}

font:14px/20px 等于 font-size:14px;line-height:20px;

如果你很纠结垂直对齐问题或者横向排列元素，不妨使用inline-block。如果你需要对一个元素跟围绕他的一些元素

进行更多控制，你需要浮动。当然，table也是你处理一些问题的最佳方案。

delegate，在同一个父元素上代理两个对象的两个事件，能实现么？解决方法：1.用addEventListener添加事件。 2.on也可以，第二个参数为选择器。”.next” —————————————-

放在body最后面的时候，则不用写window.onload。

百度提供的CDN：

性能问题，因为和其他的网站共享缓存，其他网站若使用了此文件，就会下载下来并缓存，这是我们就可以从缓存中读取，而不需要发送HTTP请求。

设计模式：设计模式是在面向对象软件设计过程中针对特定问题的简洁而优雅的解决方案。

当封装一个函数时，你是在复用代码；而当使用一个设计模式时，你是在复用他人的经验。

设计模式是一套被反复使用、多人知晓的、经过分类编目的、代码设计经验的总结。

jquery off()方法：通常用于移除通过on()方法添加的事件处理程序。

用锚点的方式，点击此超链接，会触发#rating-1的:target伪类，相当于click事件了。

锚点：点击会使之出现在可视区域内

不用JS提交，用表单，radio点击时会触发:checked伪类