![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CSS
文章平均质量分 57
YouZi_X
balabala
展开
-
分隔线集合
##基础分隔线一条黑色实线```html<hr/>```###点线```css/*点线*/.hr-dotted{border:0;border-top:2pxdotted#000;}```###虚线```css/*虚线*/.hr-dashed{border:0;border-top:2pxdashed#000;}```###...原创 2021-07-19 17:28:58 · 184 阅读 · 0 评论 -
分隔线.集
基础分隔线一条黑色实线<hr />效果如下:点线/* 点线 */.hr-dotted { border: 0; border-top: 2px dotted #000;}效果如下:原创 2021-07-19 17:25:17 · 109 阅读 · 0 评论 -
我的世界之BFC
BFC的规则、使用,使用BFC清除浮动,文字环绕,margin塌陷等问题原创 2020-07-15 00:24:23 · 1989 阅读 · 0 评论 -
实现指定字数文本溢出显示显示省略号...
方法一使用css中text-overflow:ellipsis搭配其它css属性实现。.boxCon { overflow: hidden; text-overflow:ellipsis;/*限制文本不换行,这样超出才能被截取*/ white-space: nowrap;/*width自定义调整*/ width:520px; }此方法只能显示一行...原创 2018-09-29 14:15:12 · 723 阅读 · 0 评论 -
css实现文字镂空和遮罩效果(background-clip或者 -webkit-text-stroke)
background-clip定义和用法background-clip 属性规定背景的绘制区域。默认值: border-box 继承性: no 版本: CSS3 JavaScript 语法: object.style.backgroundClip="content-box" 语法background-clip: border-box|pa...原创 2019-03-05 14:59:26 · 7696 阅读 · 0 评论 -
css实现字幕动态和静态颜色渐变效果
在上篇中介绍了如何实现字体镂空效果,实现过程:裁剪字体,使字体颜色透明,添加背景图。-webkit-background-clip: text;动态裁剪字体,移动背景图达到效果。 .label { font-size: 2.2rem; background: url("./img/2.png");//根据底图大小情况,决定是否...原创 2019-03-05 15:40:23 · 965 阅读 · 0 评论 -
css绘制梯形图形,及显示矩形图片
梯形div+transform实现如上效果,直接拉到底部。-webkit-mask-image加上梯形遮罩也可实现。1.使用border实现。等腰梯形1.1.trapezoid1-1 { width: 100px; height: 0; border-bottom: 100px solid black; border-right: 50px...原创 2019-06-26 12:01:03 · 9170 阅读 · 0 评论 -
css图形速查
css实现圆形、半圆形、三角形、平行四边形、菱形、椭圆形、圆环、蛋、彩带、钻石、对话框、tv、月亮、无限、爱心原创 2019-07-03 17:23:00 · 183 阅读 · 0 评论