随笔分类 -  CSS

table中的td内容过长显示为固定长度，多余部分用省略号代替
摘要：如何使td标签中过长的内容只显示为这个td的width的长度，之后的便以省略号代替。 table 中必须设置属性: 然后给 td 设置： 就可以实现了。 阅读全文
posted @ 2018-09-28 17:21 莫问、前程 阅读(2621) 评论(0) 推荐(0)
CSS text-transform 属性 控制控制文本的大小写
摘要：结果如下： 阅读全文
posted @ 2018-09-07 14:26 莫问、前程 阅读(994) 评论(0) 推荐(0)
那些年 IE 下踩过的坑
摘要：根据当前的市场情况，vue、react的盛行，小程序等等存在，不在兼容 ie8 已经是一个必然的趋势。ie8下的坑了解一下即可，不要在上面多花精力。再见IE8！ 1、:before，:after(伪类) 所有主流浏览器都支持 :before 选择器。 注释：对于 IE8 及更早版本中的 :befor 阅读全文
posted @ 2018-02-08 18:03 莫问、前程 阅读(206) 评论(0) 推荐(0)
CSS鼠标悬停图片加边框效果，页面布局发生错位的解决办法
摘要：CSS鼠标悬停图片加边框效果，页面布局发生错位的解决办法 阅读全文
posted @ 2018-01-03 13:59 莫问、前程 阅读(991) 评论(0) 推荐(0)
透明度兼容
摘要：将以下 sass 编译即可。 ps: ie8支持 background: transparent;（于 IETester 中测试），不支持opacity；如果是全透明的话，设置 backgound: transparent 即可。 如果使用上述方法设置全透明时，还有一点要注意，不能使用 #fff 色 阅读全文
posted @ 2017-11-29 16:13 莫问、前程 阅读(127) 评论(0) 推荐(0)
多行文字垂直居中
摘要：在说到这个问题的时候，也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗？即使是某些浏览器不支持我只需做少许的CSSHack技术就可以啊！CSS中的确是有vertical-align属性，但是它只对 HTML 元素中拥有valign特性的元素才生效，例如表格元素中的<td> 阅读全文
posted @ 2017-09-20 15:04 莫问、前程 阅读(871) 评论(0) 推荐(0)
去除行块级标签之间的默认间距
摘要：当两个行块级标签之间有空格，或者换行时，行块级标签之间会有一个默认4px的间距。去除方法如下： 方法一： 将紧连的行块级都放在一行，如果行块级的内容比较少，这么做还是可以的；但内容比较多的时候，这么做就有点不适宜了。可以采用方法二。 方法二： 给行块级标签的父级设置：font-size： 0； 在给 阅读全文
posted @ 2017-07-11 12:50 莫问、前程 阅读(939) 评论(0) 推荐(0)
前端学习之路——scss篇
摘要：一、什么是SASS SASS是一种CSS的开发工具，提供了许多便利的写法，大大节省了设计者的时间，使得CSS的开发，变得简单和可维护。 二、安装和使用 Sass依赖于ruby环境，所以装sass之前先确认装了ruby。先导官网下载个ruby。在安装的时候，请勾选Add Ruby executable 阅读全文
posted @ 2017-04-26 15:56 莫问、前程 阅读(1555) 评论(0) 推荐(0)
CSS--filter
摘要：CSS3 filter filter: none | <filter-function > [ <filter-function> ] ; 其默认值是none，他不具备继承性，其中filter-function具有以下值可选： grayscale灰度 sepia褐色（求专业指点翻译） saturat 阅读全文
posted @ 2017-04-06 16:27 莫问、前程 阅读(186) 评论(0) 推荐(0)
css3实现轮播图
摘要：css3动画属性简写： animation: name duration timing-function delay iteration-count direction fill-mode; 参数：name：需要绑定到选择器的 keyframe 名称; duration：动画完成时间 timing- 阅读全文
posted @ 2017-03-24 14:02 莫问、前程 阅读(342) 评论(0) 推荐(0)
移除input在type="number"时的上下箭头
摘要：网页在有些情况下，会需要input的输入的为单纯数字的文本框，此时type=number，但使用type=number时，输入框后面会有一个上下箭头，那么如何去掉上下箭头呢？ 1、chrome浏览器移除 input::-webkit-outer-spin-button,input::-webkit- 阅读全文
posted @ 2017-01-17 00:17 莫问、前程 阅读(3285) 评论(0) 推荐(0)