2019年4月1日
css-flex整理
flex: none | [ <'flex-grow'> <'flex-shrink'>? || <'flex-basis'> ]flex属性默认是0 1 auto (伸展 收缩 基线)flex-grow为0，则存在剩余空间也不放大 flex-shrink为1，则空间不足该项目缩小 flex-bas Read More
posted @ 2019-04-01 19:56 第一神坑 Views(343) Comments(0) Diggs(0)
css阴影框
选中div浮动的阴影框.example-card:hover {box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);transform: translate3d(0, -4px, 0);transition: 0.4s ease-in-out;}// box-sha Read More
posted @ 2019-04-01 19:55 第一神坑 Views(157) Comments(0) Diggs(0)
css实现三角形相关
1.css样式面包屑导航条实现矩形和三角箭头拼接 .cssTest { font-family: PingFangSC-Regular; font-size: 16px; color: #333333; line-height: 40px; /* 左侧部分 */ .cssTest1 { width: 750px; h... Read More
posted @ 2019-04-01 19:55 第一神坑 Views(293) Comments(0) Diggs(0)
css相关整理-其他
1.设备像素(device pixel): 设备像素是物理概念，指的是设备中使用的物理像素。CSS像素(css pixel): CSS像素是Web编程的概念，指的是CSS样式代码中使用的逻辑像素。通过设备像素比，便可得知设备像素与CSS像素之间的比例。当这个比率为1:1时，使用1个设备像素显示1个C Read More
posted @ 2019-04-01 19:53 第一神坑 Views(131) Comments(0) Diggs(0)
2019年3月23日
解决汉字和一段超长的数字合并在一起展示的时候换行的问题
//添加样式，自动换行 word-break: break-all; word-wrap: break-word; display: inline-block; 标点符号中带着文字换行问题：line-break: anywhere; 来源：https://zhuanlan.zhihu.com/p/4 Read More
posted @ 2019-03-23 10:41 第一神坑 Views(418) Comments(0) Diggs(0)
2019年3月20日
css 修改svg图标的颜色（多种方式）
方式一：利用drop-shadow 给icon加样式 (利用原图标的阴影区域，同时将原图标移动超过之前父元素范围)filter: drop-shadow(red 80px 0);transform: translateX(-80px);给父元素加样式 （父元素超范围隐藏，正好把原图标的隐藏掉，显示阴 Read More
posted @ 2019-03-20 17:37 第一神坑 Views(55103) Comments(0) Diggs(0)
2019年3月6日
angular material 修改步进器 stepper 的图标
对步进器的具体使用可以参见material官网api文档 https://material.angular.cn/components/stepper/api Read More
posted @ 2019-03-06 15:54 第一神坑 Views(900) Comments(0) Diggs(0)
2019年3月4日
canvas渐变色圆环进度条（angular2）
//canvas.component.html //自定义模板数据 canvas.component.ts import { Component, OnInit, ViewChild, ElementRef, Input } from '@angular/core'; @Component({ selector: 'app-canvas', templateUrl: ... Read More
posted @ 2019-03-04 18:55 第一神坑 Views(1049) Comments(0) Diggs(0)
2019年2月27日
-webkit-box-orient: vertical; 在webpack上失效
-webkit-box-orient: vertical;在webpack上失效，可以使用以下方式解决 Read More
posted @ 2019-02-27 09:46 第一神坑 Views(777) Comments(0) Diggs(0)
2018年12月10日
form下的基于angular material的Datepicker报错解决
正确代码 问题： 1. 解决：在form中使用ngModel 的时候需要给input加上 name 属性，或者是给input加上 [ngModelOptions]="{standalone: true}" 设置了这个属性之后input就不会加在FormGroup中（使用带有“ngModel"的”<i Read More
posted @ 2018-12-10 19:09 第一神坑 Views(961) Comments(0) Diggs(0)