css
柠檬不萌只是酸i
研究生在读 | 努力发论文 |
迈出第一步,才是新的开始。
展开
-
怎样修改【placeholder】里面文字的颜色、字体大小等一些属性呢
input::-webkit-input-placeholder { color: #b9b9b9; /* 更改placeholder的字体颜色 */ font-size:28px; /* 更改placeholder的字体大小 */}input::-moz-input-placeholder { color: #b9b9b9; font-size:28px;...原创 2019-08-19 11:26:06 · 954 阅读 · 0 评论 -
文字垂直居中使用line-height实现不了。
需求:有个固定宽高的盒子,但是盒子里面的文字是不确定的,现在想让文字在盒子的垂直方向上居中显示,该如何实现呢?先看下结果图:(要的就是这种结果)代码核心:(1)为什么不能使用line-height,因为文字的长度不固定,如果是一行文字的话,我们完全可以使用line-height来实现。但是要是文字折行的话,那就不可以了。(2)使用flex布局,然后使用里面的垂直居中显示属性...原创 2019-08-16 09:16:25 · 1084 阅读 · 0 评论 -
解决【display:flex布局】遇上 【position: absolute / fixed 】的失效问题
问题描述:有个这样的页面,页面是通过flex布局的,现在想将头部( 我的订单栏 )固定,那么我们第一反应就是添加定位呀,position : fixed。但是问题来了,position可以添加,但是添加之后,页面变成这样了(如下所示),也就是设置的display:flex 失效了,不起作用。position 一般常用的属性值有三种: relative 、 absolut...原创 2019-08-11 13:39:18 · 20789 阅读 · 6 评论 -
角度单位deg、grad、turn、rad
(1)deg属性:度:deg(全称:degress)一个圆有360度90deg = 100grad = 0.25turn≈ 1.570796326794897rad即:1turn = 360deg = 400grad(2)grad属性:梯度:grad(gradians):一个圆共有400个梯度(3)turn属性:转、圈:turn(turns):一个圆共1个圈(4...原创 2019-06-19 17:48:20 · 37988 阅读 · 0 评论 -
不确定高度的盒子怎样垂直居中呢?
之前用的一直都是可以的,但是不知道为什么今天就是垂直了,居中不了。各种找问题,最后的最后呢,发现都是自己以为是对的,然后就错了。transform: translate(x,y) // 这个里面必须要两个参数,不能是一个。transform: translate3d(x,y,z) transform: translateX(x)transform: translateY(y)...原创 2019-07-25 17:31:57 · 645 阅读 · 0 评论 -
背景图 background-size的问题
遇到个小问题。设计给的图片较大,然后得在按钮上把图片全部展示。这样图片是只展示了一部分,未全部展示:.integral_mall_total{ margin:0 10px; height: 67px; background: url('../images/bg_btn.png') no-repeat center top; }想要全部展示得添加个ba...原创 2019-08-08 10:36:41 · 207 阅读 · 0 评论 -
【.less不能被解析成.css】 CSS cannot be loaded from `file:` URLs unless they end in a `.css` file extension.
今天遇到个问题,页面加载.less 后缀的文件的时候,报错CSS cannot be loaded from `file:` URLs unless they end in a `.css` file extension.大致翻译:无法从“file:`urls”加载CSS,除非它们以“.css”文件扩展名结尾。意思就是页面必须加载以.css为后缀的css文件,那么问题来了,怎样将.less...原创 2019-08-09 19:28:40 · 3727 阅读 · 0 评论 -
使用css实现对角线功能,百分比对比
实现的最终结果如下:(也可直接运行代码查看效果)实现过程:(1)使用css的渐变实现对角线对角线的实现 linear-gradient(45deg,red 30px,pink 0);(2)-135deg -45deg45deg135deg也就是说,四个角斜切的方位是按照不同的度数来完成的。代码如下:<...原创 2019-08-12 08:42:59 · 3203 阅读 · 0 评论 -
解决图片下方的缝隙问题(display : inherit 或者 vertical-align : middle)
问题描述:给一个盒子,然后在里面放入图片,仔细观察,会发现图片距离该盒子的底布是有一定的缝隙的。(如下图,自己也可以随便试下)绿色块是图片的位置,红色是盒子背景色,眼前看到的红色是图片距离盒子产生的间隙,现在是要解决这个间隙问题。问题分析: 图片产生的间隙问题问题解决:解决该问题我这暂时有两个办法:(1)方法1: 给img设置display:inherit 属性...原创 2019-08-14 01:43:31 · 1535 阅读 · 0 评论 -
实现文字垂直显示
实现页面上文字的垂直显示:效果图:核心:writing-mode : horizontal-tb;代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=...原创 2019-08-12 18:31:49 · 1205 阅读 · 0 评论