css
文章平均质量分 60
卸载引擎
世上本没有码,搬的人多了便有了码。
展开
-
【CSS】SVG实战入门,svg画曲线,svg简单动画上手入门
- `` 根元素以像素为单位定义了整个图像的 width 和 height,还通过 xmlns 属性定义了 SVG 的命名空间,- `version` 属性可定义所使用的 SVG 版本,- `` 元素的内容可以被阅读器显示在标题栏上或者是作为鼠标指针指向图像时的提示, - `` 元素允许咱们为图像定义完整的描述信息,- ``标签 用来创建一个矩形,通过 `fill` 属性 把背景颜色设为黄色。- ``标签 用来创建一个圆。原创 2023-03-14 16:57:28 · 4019 阅读 · 0 评论 -
【CSS】flex布局用法解析,快速上手flex布局,flex:1是什么意思?肯定看的懂好吧?
flex-wrap属性定义,如果一条轴线排不下,如何换行。nowrap(默认):不换行。wrap:换行,第一行在上方。(常用此项)wrap-reverse:换行,第一行在下方。flex-flow属性是flex-direction属性和flex-wrap属性的简写形式,默认值为row nowrap// 主轴水平向右,并且元素自动换行。原创 2022-12-24 17:13:19 · 5208 阅读 · 0 评论 -
【CSS】css的background属性用法详解,background常用缩写形式
//指定背景颜色 //设置背景图像, 可以是真实的图片路径, 也可以是创建的渐变背景;//设置背景图像的位置//设置背景图像的大小 //指定背景图像的铺排方式//设置背景图像显示的原点[background-position相对定位的原点];//设置背景图像向外剪裁的区域;//指定背景图像是滚动还是固定; 默认滚动;...原创 2022-06-24 16:50:59 · 3869 阅读 · 0 评论 -
canvas绘画折线段
canvas绘画折线段,canvas快速简单划线画线原创 2022-06-08 15:50:46 · 174 阅读 · 0 评论 -
【CSS】网页如何快速适应大屏显示,快速自适应,旧版网站改造
使用CSS与结合,放大整个屏幕@media:不同分辨率修改样式zoom属性设置或检索对象的缩放比例,通俗的理解我们在body标签添加一个class标签,在使用媒体查询的方式去修改zoom的值,这样就达到了不同分辨率下不用再去针对性的修改样式其他兼容问题给zoom样式加了个判断浏览器,是谷歌就生效,不是就不生效.然后也给火狐适配了一下.将中间的框用个div包起来 然后将中间使用transform:scale()进行缩小,缩小到原来的0.8,然后左右距离边边各10%.代码如下:另外的自适应htt原创 2022-06-02 09:27:13 · 1665 阅读 · 0 评论 -
【CSS】css 获取从第n个元素开始,之后的所有元素 :nth-of-type(n)与:nth-child(n)
:nth-of-type(n) 选择器匹配属于父元素的特定类型的第 N 个子元素的每个元素html代码:<div id="box"> <div>111</div> <div>222</div> <div>333</div> <div>444</div></div>css代码:获取box中,除了第一个之外的其他的div#box div:nth-o原创 2022-05-03 10:54:41 · 9280 阅读 · 0 评论 -
【CSS】css快速更改某个字体图标,使用content插入字符
遇到一个小问题:使用的是组件库,但是这个组件没有提供更改图标的接口,需要更改这个特定的图标,但是最好不更改dom解决办法由于系统已经使用了这个组件库,那么就有了他的图标内容,可以先到组件库官网找到需要更改的图标,在官网界面打开控制台,获取需要的图标字符获取图标字符之后,可以使用相同的方式替换伪元素。可以看到我把下面向下的图标名的内容换成了向上的箭头。 ::ng-deep .ui-panelmenu-icon.pi-chevron-down::before { content: "\e.原创 2022-04-01 09:26:21 · 1554 阅读 · 0 评论 -
【CSS】cursor: pointer;不起作用,无法显示鼠标指向
【CSS】cursor: pointer;不起作用,无法显示鼠标指向----解决:添加上pointer-events: auto;原创 2022-01-13 16:02:52 · 6940 阅读 · 0 评论 -
【Angular】angular范例写法汇总
【Angular】angular范例写法汇总:1. *ngIf与else2. angular图片加载路径3. tabView与router路由双向选中4. 蚂蚁zorro的nz-table点击选中行添加样式原创 2022-01-07 10:29:56 · 859 阅读 · 0 评论 -
css修改滚动条样式---自定义滚动条实现
此部分针对webkit内核的浏览器,使用伪类来改变滚动条的默认样式:滚动条组成部分::-webkit-scrollbar 滚动条整体部分::-webkit-scrollbar-thumb 滚动条里面的小方块,能向上向下移动(或向左向右移动)::-webkit-scrollbar-track 滚动条的轨道(里面装有Thumb)::-webkit-scrollbar-button 滚动条的轨道的两端按钮,由于通过点击微调小方块的位置。::-webkit-scrollbar-tra原创 2021-08-19 11:48:45 · 238 阅读 · 0 评论 -
css预处理器sass/scss入门
1.css预处理器是什么?css 预处理器用一种专门的编程语言,进行 Web 页面样式设计,然后再编译成正常的 css文件,以供项目使用。css预处理器为 css增加一些编程的特性,无需考虑浏览器的兼容性问题。2.为什么要用css预处理器?最开始 css在网页中的作用只是辅助性的装饰,轻便易学是最大的需求;然而如今网站的复杂度已经不可同日而语,原生 css已经让开发者力不从心。开发者将选择另一门更高级的语言来进行开发,然后编译到底层语言以便实际运行,css预处理器应运而生,扩展了css的使用场景与范原创 2021-08-04 09:27:16 · 795 阅读 · 0 评论 -
div p、div>p、div+p、div~p、div.a 、p,span的用法和区别
啊原创 2021-07-19 09:04:35 · 980 阅读 · 0 评论 -
CSS设置一行文字,超出部分自动隐藏
CSS设置一行文字,超出部分自动隐藏.text{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}原创 2021-07-16 09:20:03 · 5213 阅读 · 0 评论 -
使用伪类:before在元素前面插入css绘制的图标
项目中总是能遇到奇怪的需求,比如今天就遇到了需要在某个弹窗标题元素前面插入一个图标。但是最好不要引入图片。原来的弹窗新弹窗实现代码主要目的就是在title前面通过伪类:before插入一个css样式元素。使用border-radius: 50%;绘制圆形。使用before {content: "?";}添加伪元素。body .ui-dialog .ui-dialog-titlebar .ui-dialog-title:before { content: "?"; displ.原创 2021-05-14 17:06:39 · 2450 阅读 · 0 评论