有没有经常遇到一些样式每次写都要用百度呢？我收集了一些我平时经常要用到的但又总是记不住的样式。有错误的地方欢迎指正。转载请注明出处。一、设置input的placeholder的字体样式设置input聚

2018年已经过了一周，总结一下2017年在公司wiki上写的一篇关于css布局的知识，当时也借鉴了几个大神写的css布局知识，和自己在项目中遇到的坑。废话不多说。请看以下的干货。 第一种实现方式通过负边距与浮动 实现左边固定，右边自适应的布局。 1. 自适应的容器需要容器包裹…

此方法不会存在 IE 6 中3像素的 BUG，但 .left 不可选择， 需要设置 .left {position: relative} 来提高层级。 注意此方法增加了不必要的 HTML 文本结构。 相当于right也开启了bfc，就不会被left的浮动影响到。 设置 over…

本篇章主讲双栏布局和三栏布局的一些较为古老及实用的原理及实现。说它古老主要也是因为我们不会涉及 flex 这一类魔法一般的布局方式，虽然我也知道用 flex 就能轻松实现很多布局。 做这个文章，一方面也是自己做个学习记录，当做温习一番。另一方面，也希望能够帮助看到这篇文章的新手…

有时候我在想，我们前端写页面比较花时间，能不能减少这部分时间呢？当然你会说“你傻啊，不是有UI库嘛！”，但是别忘了，不是每个项目都有可用的UI库，同时使用别人的UI库，并不能百分比能够解决你所有的问题，如果我们对CSS选择器了解的更多一些，或许就可以少写很多JavaScript…

下面分别对以上flex属性做讨论。以下部分示例图片的DOM结构如下: 其中.parent为设置display:flex的父元素为绿色,.child为被布局的子元素. 2. 对 父元素 设置的属性们 对父元素设置的属性可以控制子元素整体的布局方法。 其中||符号表示或。 注意：如…

在日常布局当中，肯定经常会遇到文本内容超过容器的情况。非常常见的一种解决方案是超出省略。 这种情况下，在容器定宽但是文本又溢出且不能换行的情况下，我们就需要寻求另外的解决方案。 当然，这种方法简单但是可能缺乏点用户体验。 我们先假设一下，我们的容器的宽度如果是固定的，但是不确定…

水平垂直居中是页面布局中及其常见的样式，关于实现方式也是多种多样，闲话少说，我们直接进去正题。 好了，前戏到此为止，下面是重头戏了。 这种方法要根据父子元素的宽高来计算top和left的值，如果页面布局复杂起来，每一个都这样计算岂不是要烦死我这样的数学白痴？个人觉得这种方法有点…