随笔分类 -  CSS

js打印窗口内容并当窗口内容较长时自动分页
摘要：项目环境Angular： 方法1、window.print() HTML页面上的代码： ts文件中: 然后再用css控制打印分页 page-break-before，page-break-after属性控制分页。 不过在实际应用中，我需要打印的是弹框中的内容，使用原生的方法打印，页面的样式无法调整， 阅读全文
posted @ 2018-09-28 14:35 Viola_left 阅读(7068) 评论(0) 推荐(0)
工作中遇到的问题
摘要：1. 长英文字母强制换行 2.超出长度用省略号显示 3. 菜单打开闭合状态 每次打开都为上次的状态，用localstorage记住本地状态 4. 移动端开发时，使用tap切换，但是tap头部需要固定，在页面中设置position:fixed之后，切换tap时，薪tap部分不显示，检测出是因为为使容器 阅读全文
posted @ 2018-04-03 16:42 Viola_left 阅读(154) 评论(0) 推荐(0)
使用gulp管理sass文件
摘要：前提是npm和ruby已经安装好 1. 新建文件夹myproject，cd进入文件夹 再npm init 初始化 2.npm install gulp --save-dev 为项目添加gulp，并将gulp添加到 package.json文件中。 3.npm install gulp-sass gu 阅读全文
posted @ 2017-03-09 15:39 Viola_left 阅读(471) 评论(0) 推荐(0)
整理一些css在使用中的小技巧（进行中）
摘要：1. 消除li排列display:inline-block的间隙 阅读全文
posted @ 2017-01-16 18:00 Viola_left 阅读(178) 评论(0) 推荐(0)
CSS伪对象选择符整理
摘要：1.E::selection 2.E::placeholder 1. E::selection 设置对象被选择时的样式。 需要注意的是，::selection只能定义被选择时的background-color，color及text-shadow(IE11尚不支持定义该属性)。 兼容性: 预览： 2. 阅读全文
posted @ 2016-08-19 11:36 Viola_left 阅读(1173) 评论(0) 推荐(0)
CSS制作彩虹效果
摘要：今天看到一篇文章，说到margin的塌陷的问题，并提供了好几个例子。 自己之前还没怎么遇到过这个问题，正好来研究一下。 css样式一，使用margin塌陷： 效果： css样式二，也是使用的margin塌陷，不过做出来的是弧形的彩虹： 效果： css样式三，使用的是box-shadow： 效果： C 阅读全文
posted @ 2016-07-06 15:37 Viola_left 阅读(3129) 评论(0) 推荐(1)
页面显示文字，多出的部分省略号代替
摘要：文字只有一行，可以使用css实现: .column-p{ width:500px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } 多行文字的情况下，则需要使用js判断字数截取 <div class="column"> < 阅读全文
posted @ 2016-06-07 17:18 Viola_left 阅读(417) 评论(0) 推荐(0)
box-sizing属性
摘要：box-sizing属性默认值是content-box；指定了标准的盒模型。如果替换为box-sizing:border-box，浏览器将会为那个元素应用IE的盒模型，即width和height属性将包含边框(border)和内边距(padding)。当想以百分比形式为元素设置总体尺寸，又想以像素单... 阅读全文
posted @ 2016-01-27 14:15 Viola_left 阅读(378) 评论(0) 推荐(0)
表格隔行换色
摘要：实现列表中隔行显示背景颜色Html代码 姓名公司职位标签性别工作年限 杜海君 赛诺菲民生健康药业有限公司 研究员 AC 女 5年 桑以文 上海仁画信息科技发展有限公司 程序员 高级软件工程师高级软件工程师 男 ... 阅读全文
posted @ 2016-01-22 15:30 Viola_left 阅读(460) 评论(0) 推荐(0)
javascript学习笔记20160121-css选择器
摘要：元素可以用id、标签名或类来描述：更一般的，元素可以基于属性来选取：这些基本的选择器可以组合使用：选择器可以指定文档结构（重要，之前一直不太明白>的使用）：选择器可以组合起来选取多个或多组元素：各浏览器中querySelector和querySelectorAll的实现差异css定义了“:first... 阅读全文
posted @ 2016-01-21 11:12 Viola_left 阅读(129) 评论(0) 推荐(0)
修改placeholder颜色
摘要：#contact_info为textarea的ID#contact_info::-webkit-input-placeholder{ color:#999;}#contact_info:-moz-placeholder{ color:#999;}#contact_info::-moz-placeho... 阅读全文
posted @ 2015-12-09 17:28 Viola_left 阅读(208) 评论(0) 推荐(0)