css
文章平均质量分 66
黄祚敏
前端工程师一名。
展开
-
字体加载
需求:就在字体加载完成时,将该字体的字绘制到canvas 中。假如该字体未加载完成前,使用canvas 绘制的就是默认字体的字。涉及到的项目:青柠设计:https://qingning6.com/一。如何判断一个字体是否加载完成。使用api :document.fonts./** * 验证字体是否加载完成 * fonts => [{fontSize, fontFamily}] * */function validFonts(fonts) { return new Prom原创 2021-04-02 17:24:08 · 1080 阅读 · 0 评论 -
css 文字渲染
css 文字渲染实测结论:测试的内容都是使用span 标签(即是用内联元素进行测试的)具体显示效果可以参考:青柠设计:https://qingning6.com/参数说明:字体自带行高:fontLineHeight;css设置的行高:lineHeight;字大小:fontSize;行数: row;列数: col;文字宽高:width、height;字间距:letterSpacing;水平文字:单行文字,文字的高度:height = fontLineHeight 多行文字,文字高度:hei.原创 2021-04-01 11:18:07 · 379 阅读 · 0 评论 -
css定位
一。css的定位。 CSS 有三种基本的定位机制:普通流、浮动和绝对定位。 普通流:就是一般的元素的位置。 浮动:就是通过 float 这个属性进行设置。 绝对定位: 主要就是 position 这个属性。二。float 属性的说明。 float属性主要是 left / right / none / inherit原创 2017-07-12 18:10:22 · 239 阅读 · 0 评论 -
css元素水平放置
一。如果想让处在一级的元素水平放置。可以通过设置 display:inline-block 这个样式或者是 display: inline 。 例如:想让下面的水平放置,实现的效果如图:这个就是通过对 设置 display:inline-block 效果形成的。如果设置成 display: inline。只会是在一排但是垂直方向上面不一致。所以一般想水平放置元素最好使用 dis原创 2017-07-12 18:38:46 · 1149 阅读 · 0 评论 -
css基础
一.引入css的三种方式: 1.内联属性(Inline style attribute)的使用方法是,对于想要设置样式的HTML元素,直接修改他的style属性,将css代码直接写在style属性里。比如:<html><body><h1 style="font-size: 12px;">我的字号被修改了</h1></...原创 2016-07-11 13:14:12 · 88 阅读 · 0 评论 -
input file 美化
1.input file 美化的基本思想是 将 <input type="file" /> 的样式 opacity: 0;也就是透明度为零。 2.本人推荐一种办法:<input type="file" id="file" class="input-file" /><label for="file" >选择文件原创 2017-04-05 09:19:14 · 424 阅读 · 0 评论