前端笔记之国庆前端七天乐

所有笔记由尚硅谷视频得来~

10.1

       追星去了嗨了一天没学

10.2

      1.盒子的大小：

  

 2.轮廓阴影和圆角：

首先是轮廓，outline的应用：

第二个讲的是阴影，以及用阴影时可以调整的一些值，如羽化等等

 最后是圆角：（以及如何设置成圆形）

（学会这个你将被小米200万聘请（狗头））

 3.浮动的简介：

浮动这一节很重要！！之前div不是会自占一行嘛！现在就可以打破了！

 不过要注意第六点哦！简单来说就是：不要超过“哥哥”；

总结一下：

 4.浮动的特点：

其实还是这些东西，加上的就是行内元素，脱离文档流之后，就世界大同了

 5.导航条练习：

终于到了一个小练习！这是我做的，字体没找好，有些拉：

 原版是这样：

 5.网页布局：

弹幕里有争论为什么不全用div的，记住：语义化标签优先，方便以后维护的！！

6.高度塌陷和BFS：

问题：父元素的高度不应该被写死！！

 

 由于float脱离了文档流，即会塌陷：

 那怎么解决呢？用BFC！

 但BFC并不是一个单独的样式，而是有三种方法可以实现它：

 第三个最常用，其实也就是一句代码：

10.3 继续继续！国庆必把HTML+CSS看完！

1._clear的作用：

clear就是消除浮动的作用：

 2.使用after伪类解决高度塌陷：

 加after的效果和再加一个div一样，这样就能撑起来了；

3.使用clearfix来解决：

 这是最终的王炸了！！！！

4.到了最重要的一个环节了！！定位问题！

 首先是相对定位：

 虽说是有四个值，但两个一般就够用了；

然后是绝对定位：

 固定定位：跟小广告一样，只跟浏览器的视口有关，死活不动

粘滞定位：动到一定程度就不动了

10.4 感冒个球了....但还是不能阻挡学习的步伐！！！

1.绝对定位元素的位置：

 听得迷迷糊糊的，貌似很重要，可以实现box完全居中的一个方法。

2.元素的层级

可以用z-index来控制层级：没有的话就谁在下面谁高

 

 但还有一点：

 3.字体

如果要用用户没有的字体，可以直接这么干：

 4.图标字体

按照老师的步骤已经安装进去啦！

 也试了一下：

是可以哒！用i标签来表示哦宝贝！ 

5._iconfont-----阿里上的图标库更多一些，也要学会使用哦~

 规则都是一样的，掌握方法就好啦，不用动脑子的。

6.行高

 没啥好说的，注意一下记好了；

7.字体

 就是讲了字体的一些小细节，怎么设置的；

 8.文本的水平和垂直对齐：

 一些不太常用但可以知道知道的小tips

图片有缝对不齐的时候试试这个：

 9.其他的文本样式：

 多出的文本搞成省略号的方法：

10 京东导航条！跟做ing!! 

10.5 又是热爱前端的一天！！！

昨天留下的京东导航条，搞了几个小时终于搞好了，细节什么的太恶心了。。

 真是看着简单做着难。。

1.PS的安装：

安装了PS，简单的小应用还是要会的，比如把单位调成像素*像素啊巴拉巴拉的。

10.6-10.7   快组会了呜呜呜在狂看论文！！！

1.背景：

 

 

 

 看着很多，其实都是一些小TIPS，用的时候看看就知道了。

那国庆就结束啦！！！学到很多但路漫漫其修远兮！冲冲冲！