随笔分类 -  css

三种移动端布局方法
摘要：这篇文章，主要是总结一下，我在移动端布局用过的方法。有三种，一种是响应式布局，利用@meida判断各个size；第二种是REM；最后是设置viewport中的width。 响应式布局 这种感觉是最好理解了，利用@media进行断点，在每个断点中编写css。 上面这段代码，在浏览器的宽度低于768时有 阅读全文
posted @ 2017-07-17 15:21 objectBao 阅读(2472) 评论(0) 推荐(0)
CSS实现单行、多行文本溢出显示省略号（…）
摘要：如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来，当然还需要加宽度width属来兼容部分浏览。 实现方法： 效果如图： 但是这个属性只支持单行文本的溢出显示省略号，如果我们要实现多行文本溢出显示省略号呢。 接下来重点说一说多行文本溢出显示省略号，如 阅读全文
posted @ 2017-04-09 15:09 objectBao 阅读(661) 评论(0) 推荐(0)
将footer固定在页面最下方
摘要：方法一： HTML结构： CSS结构： 方法二：footer高度固定+绝对定位 html结构： CSS设置： 首先，设置body的高度至少充满整个屏幕，并且body作为footer绝对定位的参考节点； 其次，设置main（footer前一个兄弟元素）的padding-bottom值大于等于foote 阅读全文
posted @ 2017-03-19 16:14 objectBao 阅读(2634) 评论(0) 推荐(0)
(转)30 分钟学会 Flex 布局
摘要：原文链接：https://zhuanlan.zhihu.com/p/25303493 最简单实用的 Flex 布局教程，30 分钟让你学会 Flex 语法基础。 最简单实用的 Flex 布局教程，30 分钟让你学会 Flex 语法基础。 为什么我要写这一篇关于 Flex 布局的教程？ 因为它十分简单 阅读全文
posted @ 2017-03-11 21:28 objectBao 阅读(233) 评论(0) 推荐(0)
Html5 input placeholder 属性字体颜色修改。
摘要：这篇文章主要介绍了有关HTML5 input placeholder 颜色修改方面的知识，需要的朋友可以参考下 Chrome支持input=[type=text]占位文本属性，但下列CSS样式却不起作用： CSS 代码如下: input[placeholder], [placeholder], *[ 阅读全文
posted @ 2017-02-22 15:27 objectBao 阅读(14430) 评论(0) 推荐(0)
使用 letter-space 后文字不能居中解决
摘要：使用letter-space后和上面的字体对比明显没有居中； 选定元素后发现，每个字后面都被加了2em,不是不能居中而是因为多了最后一个字的2em,所以向左多对齐了2em。 解决办法： 如果觉得过于冗余，还是建议在字符之间 加" "吧 阅读全文
posted @ 2017-02-21 10:46 objectBao 阅读(1695) 评论(0) 推荐(0)
将HTML页面页脚固定在页面底部(多种方法实现)
摘要：当一个HTML页面中含有较少的内容时，Web页面的footer部分随着飘上来，处在页面的半腰中间，给视觉效果带来极大的影响，接下来为大家介绍下如何将页脚固定在页面底部，感兴趣的朋友可以了解下 作为一个Web的前端工作者学习者，在制作页面效果时肯定有碰到下面这种现象：当一个HTML页面中含有较少的内容 阅读全文
posted @ 2017-02-18 11:29 objectBao 阅读(39669) 评论(1) 推荐(5)