随笔分类 -  css

两列布局（浮动、定位、flex）和三列布局（圣杯、双飞翼、flex）
摘要：demo 各种布局演示 https://jsfiddle.net/mayufo/qp890peq/1/ 两栏布局 浮动 定位 flex 三栏布局 圣杯布局 双翼布局 flex 相同点 圣杯和双飞翼布局解决问题一半是相同的，三栏全部float浮动，左右两栏加上负margin让其跟中间栏div并排，以形 阅读全文
posted @ 2017-08-07 15:11 mayufo 阅读(2255) 评论(0) 推荐(0)
多行文本溢出 省略号显示
摘要：补充1 js方法实现 原理： 1 通过给文字段固定的行高，每次通过固定的行高和可视高度进行判断 2 如果超过固定行高，减少显示的单词，直到显示我们希望的行高。 代码： demo https://jsfiddle.net/m3uv2ad3/1/ 缺点 1 文本块需要有固定的高度 2 当其中某个单词过长 阅读全文
posted @ 2016-12-27 23:23 mayufo 阅读(404) 评论(0) 推荐(0)
为什么我获取不到这个css样式？js原生获取css样式总结
摘要：还是自己遇到的一个坑的总结吧！与其说是坑不如说自己学艺不精，让我先哭一会！！ 需求 简单就是获取一个css的height （好吧 就是一个这么简单的需求） 实践 好吧 长时间的JQ 我已经对原生无能了 让我默哀3秒！！！ 这个果然不生效 好吧 看来我真的倒退不少！让我再哭一会！！（哭你妹 快去总结） 阅读全文
posted @ 2016-08-30 11:29 mayufo 阅读(6787) 评论(1) 推荐(1)
文本溢出省略号显示时，水平位置发生偏移
摘要：问题 经常有这样的需求，给一个定宽的div.但是里面放的内容有时候会超长，这时候就有需求，要求剩下的省略号显示啊！ 这个很简单啊 但是 会出现这样的问题 [demo](https://jsfiddle.net/mayufo/x7e8s36v/3/） 竟然没有对齐！！！ 解决 1 给左边上浮的div 阅读全文
posted @ 2016-08-10 19:44 mayufo 阅读(326) 评论(0) 推荐(0)
多行文本溢出显示省略号 多行文本折行省略并存
摘要：最近在项目的制作过程中遇到超出需要折行的问题 如果是一行超出 问题 如果是两行显示，第一行折行，第二行需要超出省略该如何实现呢？ 或者第N行要省略该如何解决呢？如果是两行显示，第一行折行，第二行需要超出省略该如何实现呢？ 解决 解决方案1 css 的不规则属性解决 是一个不规则属性，不出现在css 阅读全文
posted @ 2016-07-18 18:00 mayufo 阅读(479) 评论(0) 推荐(0)
css 简单的 before after 笔记
摘要：元素：：first-line 段落得第一行样式元素：：first-letter 第一个字母元素：：first-before{ content：“mayufo”;}contentd的内容插入元素之前元素：：first-after{ content：“mayufo”;}contentd的内容插入元素... 阅读全文
posted @ 2015-01-02 23:36 mayufo 阅读(195) 评论(0) 推荐(0)
重置样式
摘要：body,h1,h2,h3,h4,h5,h6,p,dl,dd,ul,ol,form,input,textarea,th,td,select{ margin: 0px;padding: 0px;};em{font-style: normal;}li{list-style: none;}a{text-d... 阅读全文
posted @ 2015-01-01 21:23 mayufo 阅读(128) 评论(0) 推荐(0)