m0_50971101的博客

距离学习js已经有一个月的时间了，发现js并没有想象中的那么难，但是知识点比较零碎，而且要具备一定的编程逻辑和编程思维，这需要一段时间的培养，也是我现在学习的重点，现在对前面js的学习做一个总结使用js的两种方式1、直接在Html内使用script标签，一般加在body的最下面，这样做的好处是在页面加载时优先加载HTML的内容，提升性能2、引入外部文件，同样加在body最下面<script src="路径"></script>3、IE浏览器的引入js暂时没有学习数据类型

遇到的问题：1.在图片的某一个固定位置设置hover解决：可以先在该位置设置一个块，hover时出现，具体实现代码如下：.app-down{ display: block; width: 215px; height: 55px; position: absolute; top: 185px; right: 16px; } .app-down:hover{ background

视口、移动端百分比布局分辨率：屏幕像素的数量视口的分类：1.布局视口 网页的宽度。768，980，1024px2.视觉视口 等于手机屏幕的宽度3.理想视口 布局视口=视觉视口可以通过<meta>标签改变视口的大小不同的设备有不同的理想视口，只需要加上下面这句话，浏览器会自适应设备的理想视口 <meta name="viewport" content="width=device-width, initial-scale=1.0">移动端一般使用百分比布局，宽度

经过半个月的学习，我对html和css有了更深更系统的理解，同时，发现了一些以前做项目的一些不足之处，总结了几点：1.在动手之前，要提前设计好div的框架，考虑具体实现的可能2.class以功能命名，多利用class的多重命名，可以有效的减少代码3.利用并集选择器也可以精简代码，同时，要熟练掌握一些伪类选择器的应用，比如nth-child(),:not(:last-child)等4.单行导航可以使用a标签，更加方便省事5.对于伪类的使用，:before和:after，可以应用于一些网站中两个div

flex盒子flex是弹性盒子，给父盒子添加display:flex;子元素会按照从左到右排列，与浮动相比不会脱离文档流，但兼容性较低，IE9以下不支持，IE10仅部分支持。属性：flex-direction:设置盒子的排列方式row 从左到右水平排列row-reverse 水平反向排列column 从上到下垂直排列column-reverse 垂直反向排列flex-wrap:规定单行还是多行nowrap 默认不换行，会改变子盒子的宽度wrap 换行wrap-reverse 反向换行

今天主要学习了css的一些动态特效。精灵图首先，我们学习了什么是精灵图，以及精灵图的应用。精灵图是很多张图片或是logo放在同一张图片上，我们可以根据图片的像素值选择位置找到我们需要的图片。代码如下： .div2{ width: 120px; background-image: url(img/timg.jpg); background-position: -140px -450px; } .

css定位1.相对定位position:relation;相对于自己原来的位置定位，进行位置的调整与margin的区别：margin：盒子间的距离，会影响下一个盒子的位置相对定位：只影响自己，不影响其他元素，不脱离文档流相对定位一般用于绝对定位的参考2.绝对定位position:absolute;坐标系，默认在父容器或者浏览器的左上角，脱离文档流主要应用与页面的两个div之间的压盖效果（子绝父相）绝对定位盒子居中：left:50%;margin-left:负盒子宽度的一半；代码

css标准文档流+浮动今天主要学习了css标准文档流+浮动1.标准文档流含义：内容是从上到下，从左到右书写的，例如word文档，web页面就是标准文档流特性：（1）空白折叠，无论输入多少个空格或者tab，会折叠成为一个空格（2）高矮不同，底部按照基线对齐（3）自动换行标准文档流将HTML元素分为两类，行内元素和块级元素将HTML标签分为两类，容器级元素和文本级元素行内元素：宽，高设置无效，例span块级元素：独占一行，例h1,p容器级元素：几乎能嵌套所有标签，例div,h1~h6文

今天上午首先对上周五的学习内容进行了复习，主要是对选择器的一些补充和css的两大特性。选择器补充内容：1.子代选择器，格式为选择器1>选择器2（1是2的父级元素）IE7开始兼容2.后代选择器，格式为.div1空格p（前者必须为后者的祖先级元素）3.交集选择器，格式为选择器1选择器2（只支持类选择器与类选择器或标签选择器与类选择器，标签选择器一定要在类选择器前面）既要满足选择器1又要满足选择器24.并集选择器，格式为选择器1，选择器25.伪类选择器，分为静态和动态两种静态只能用于超链接

今天是学习前端的第四天，上午对昨天的form表单学习进行了补充，补充了下拉选择框和一个边框样式fieldset的应用。form表单由select下拉列表嵌套option列表选项组成，主要应用于网站个人信息的填写，里面的属性值有size：可以设置显示几个列表选项，mutiple：可以进行多重选择。fieldset运用在form表单里，主要是为form表单添加边框，可以用legend设置标题，效果如下：![](https://img-blog.csdnimg.cn/2020110518310283.png