蒲厷渶と戀的博客

元素如果设置display为inline-block，元素间会有一段默认的间隙。这种间隙是由元素间的回车照成的，有时候会影响样式的精确度，代码及效果如下：HTML、CSS、效果图：解决方法：第一种方法：html不变而css变，css如下：如上图，父级元素的font-size设置为0，子元素设为对应大小。效果如下：第二种方法：htm

浮动会使当前元素脱离普通文档流，从而对父级元素和兄弟级元素造成影响，最终影响布局。所以，清除浮动是每个前端必须掌握的知识。下面列举几种清除浮动的方法，如下：方法1：父级定义高度（height）html代码：css代码：效果图：原理：父级元素手动设置高度，可以解决子元素浮动后，父级元素无法自动获取高度的问题。优点：代码少、简单、易掌握。缺点

项目中，经常会用到input标签，有时候还会用到input标签的只读属性“readOnly”。但是，input标签的只读属性“readOnly”具有一定的局限性，它只支持谷歌浏览器，不支持火狐浏览器和IE8浏览器。如果要求考虑兼容性，让input标签的只读属性同时支持谷歌、火狐和IE，那么我们可以采用input标签的另外一个属性：disabled。动态设置只读属性的具体方法如下：HTML代码：

项目开发过程中，涉及到了图片上传和文件上传。在做"图片上传"和"文件上传"的功能时，我在项目中用的是form表单，简单示例如下：一、图片或文件上传HTML代码如下：在页面渲染效果如下：选择文件，点击提交，执行结果如下：由上面执行结果的第一张图可知，Form表单中的action已被执行；由上面执行结果的第二张图可知，所选文件及相关信息已被上传。

项目开发中，为了美观，经常会隐藏滚动条，但保留滚动效果（滚动条的宽度为18px），下面介绍一个简单的方法：HTML代码：CSS代码：效果图：

1、html代码：<div class="radar"></div>2、css代码：* { box-sizing: border-box;}html, body { background-color: #000;}.radar { background: -webkit-radial-gradient(center, rgba(0, 0,...