首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    文字描边-webkit-text-stroke和text-shadow

    一、-webkit-text-stroke属性 用caniuse查看text-stroke兼容性的时候,发现了一件令我震惊的事情,最新版的Firefox以及Edge已经支持text-stroke描边属性了...二、-webkit-text-stroke文字描边简介 CSS text-stroke属性的语法并不复杂,和border,background属性类似,其实是若干个CSS属性合并后的名称写法,不过仅仅是下面这两个...CSS属性合体:text-stroke-width和text-stroke-color,也就是描边的宽度和描边的颜色,和border不同,对于text-stroke属性,我们无法指定描边的类型,只能是实线描边...简单示意: .stroke { -webkit-text-stroke: 2px red; } 等同于: .stroke { -webkit-text-stroke-width: 2px;...border-width的默认值是medium,最终表现等同于设置3px,但是text-stroke-width的默认值确是0,这就意味着,当我们使用text-stroke属性的时候,描边宽度是必不可少的

    3.4K21

    dotnet 读 WPF 源代码笔记 Stroke 类可能存在的内存泄露

    本文将从源代码的角度告诉大家这个内存泄露问题和如何解决 在满足如下条件的时候,将会让 Stroke 类出现内存泄露 存在一个 Stroke 被强引用,将这个 Stroke 记为 A 对象 取 A 对象的...,请看代码 var stroke = new Stroke(new StylusPointCollection(stylusPointList), StrokeVisual.Stroke.DrawingAttributes...Stroke 对象,会让另一个 Stroke 不会被释放 通过 WPF 的源代码可以看到,在 Stroke 里面是将 DrawingAttributes 作为属性存放,因此 Stroke 强引用 DrawingAttributes...如果使用被强引用的 Stroke 的 DrawingAttributes 去创建另一个 Stroke 对象,因为在 Stroke 对象的构造函数里面有如下代码 internal Stroke(StylusPointCollection...因此如果多个 Stroke 使用相同的一个 DrawingAttributes 对象,有一个 Stroke 被强引用,那么其他的所有的 Stroke 对象也不会被释放 本文的测试代码放在 github

    51420

    精读《不再需要 JS 做的 5 件事》

    关注 JS 太久,会养成任何功能都用 JS 实现的习惯,而忘记了 HTML 与 CSS 也具备一定的功能特征。其实有些功能用 JS 实现吃力不讨好,我们要综合使用技术工具,而不是只依赖 JS。...概述 使用 css 控制 svg 动画 原文绘制了一个放烟花的 例子,本质上是用 css 控制 svg 产生动画效果,核心代码: .trail { stroke-width: 2; stroke-dasharray...: 3; stroke-dashoffset: 80; } 100%, to { stroke-width: 0.5; stroke-dashoffset: -150...; } } 可以看到,主要使用 stroke-dasharray 控制线条实虚线的样式,再利用动画效果对 stroke-dashoffset 产生变化,从而实现对线条起始点进行位移,实现线条 “绘图...使用 JS 判断还是挺复杂的,你得设法监听父元素滚动,并且在定位切换时可能产生一些抖动,因为 JS 的执行与 CSS 之间是异步关系。

    2.3K20
    领券