解决@font-face跨域的两种方法：https://m.daixiaorui.com/read/283.html浏览器支持Internet Explorer 9, Firefox, Opera,Chrome, 和 Safari支持@font-face 规则.但是, Internet Explorer 9 只支持 .eot 类型的字体, Firefox, Chrome, Safari, 和 Opera 支持 .ttf 与.otf 两种类型字体.注意： Internet Explorer 8 及更早IE版本不支持@font-face 规则.属性定义及使用说明@font-face规则，网页设计师再也不必使用的"web-safe"的字体...
浏览器支持度CSS3属性： columns：规定列的宽度和列数 默认宽度、列数值为auto column-width:每栏的宽度 column-gap :两栏之间的间距距离 column-count : 栏目的数目 column-rule : color(色值) width(宽度) style(线条样式) 分栏中的分割线的颜色宽度及样式的设定 1、border-radius属性(圆角边框)eg:结合不同浏览器兼容问题，使用该CSS3新属性 eg: 2、box-shadow属性（阴影） eg:结合不同浏览器兼容问题，使用该CSS3新属性 eg: 3、...
学了就忘，该记录一下了字体下载网址：http://www.dafont.com http:www.google.com/webfonts用法：@font-face { font-family: ‘zwl‘; src:url(‘fonts/zwllll.eot‘) format(‘eot‘), url(‘fonts/zwllll.ttf‘) format(‘truetype‘), url(‘fonts/zwllll.woff‘) format(‘woff‘), url(‘fonts/zwllll.svg‘) format(‘svg‘); font-weight: normal; font-style: normal;}到这里定义好了字体，也就是说浏览器能识别zwl这...
CSS font-family字体大合集在写文字内容占大篇幅的页面是，总是会面临着改变字体的需求，以下为font-family常用合集以及一部分文字效果：windows常见内置中文字体字体中文名 字体英文名 效果实例 宋体 SimSun（浏览器默认） 夏目友人帐/ABCDEFG 黑体 SimHei 夏目友人帐/ABCDEFG 微软雅黑...
经常能看到别人做前端的时候，实现一些漂亮的复选框或单选框按钮，由于现在项目原因，很多单选框和复选框看起来很不好看，于是，心血来潮打算自己实现了一遍。一、首先上css代码：其中，说明我以注释的形式写到里面；关于z-index我是基于一开始的定位考虑来设置的，此处如果谁要用到，自行思考；/*复选框效果*/ input[type=checkbox] {width:16px;height:16px;z-index:10; } /* 此处不解释，定义的是复选框宽高*/ input[type=chec...
为理解用户代理怎样决定字体变形的粗细，得先从关键字100到900谈起，然后我们再来看它是如何继承的。 font-weight允许值 normal | bold | bolder | lighter | l00 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 这些数字关键字用于定义与字体的相关特征的映射关系，即字体的粗细被分成九个等级。例如，OpenType就使用了九个值的数字级。字体有了这 级别之后，这些数字就直接映射到各个级，如100映射到最轻的字体变形，而90...
一家名为 Source 公司，曾经开发多款实用 Photoshop 外挂工具，例如：CSSHat、PNGHat 和 Subtle Patterns，最近推出一款全新延伸功能「Fontea」，让用户轻松在 Photoshop 绘图工具里存取使用 Google Fonts 免费字型，内建筛选、搜寻及收藏功能，一键就能将众多字型套用到现有设计项目，省去手动下载字型再安装的麻烦。 Fontea 目前已经支持 Windows、Mac OS X 两大平台，能在 Photoshop CC 2015+ 安装，这个外挂特色是能快速将 ...
Hihi, 大家好~ 最近有不少人都提及了网页上该如何选择字体的问题。问题虽然小，但是却是前端开发中的基本，因为目前的网页，还是以文字信息为主，而字体，作为文字表现形式的最重要参数之一，自然有着相当重要的地位。可惜字体的重要性在很长时间内并没有得到足够的重视。很多人对字体的概念还是停留在 font-family: "宋体", Arial, Helvetica, serif 的阶段，却不明白为什么这样设置，这样设置是否合理等等。现在就让我说说字体的...
Fonts.css -- 跨平台中文字体解决方案 一直以来跨平台的中文字体 CSS 设置都是一件让人很头疼的事情，这个库打包了一些常见字体的名字，希望能覆盖 Windows、Mac 以及 Linux 的常见字体，方便引用。在 font-family 直接支持宋、楷、黑和仿宋之前，我觉得这样一种解决方案依然还是必要的。 Demo & Doc http://zenozeng.github.io/fonts.css/ NPM npm install fonts.css --save Usage 故...
一、unicode-range是什么？一看名称，很多小伙伴可能认为是个什么生僻的东西，实际上，这玩意只是名字怪怪的，功能关键时刻还是很管用的。unicode-range是一个CSS属性，一般和@font-face规则一起使用。大家应该不赶时间吧，那我们一点一点往下深入，现在很多网站会使用微软雅黑字体，但是，微软雅黑的名称有点长：.font {font-family: microsoft yahei; }如果这个字体不是全局的，每次用到都要写一遍都很烦。虽然说，现在Sass, Les...
很多人只要一提到@font face规则，心中就会不由自主“哦~~”的一声：“这个我知道，可以用来生成自定义字符小图标！”话是没错，问题在于很多人就以为生成字符小图标就是@font face规则的全部，实际上只是功能之一，如果真正了解@font face规则，你会发现，@font face规则可以做的事情其实非常多，尤其我们不考虑IE7，IE8浏览器的情况下。一、 @font face的本质是变量虽然说CSS3新世界才出现真正意义上的变量var（参见此文：“了解...
font-family版本：CSS1 兼容性：IE4+ NS4+ 继承性：有 语法：font-family : name font-family : cursive | fantasy | monospace | serif | sans-serif 参数： name : 字体名称。按优先顺序排列。以逗号隔开。如果字体名称包含空格，则应使用引号括起第二种声明方式使用所列出的字体序列名称。如果使用fantasy序列，将提供默认字体序列 说明： 设置或检索用于对象中文本的字体名称序列。默认值由浏览器确定。序列可包含嵌入字...
本章给大家介绍CSS3如何实现字体抗锯齿渲染效果？-webkit-font-smoothing属性（实例），有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。对字体进行抗锯齿渲染可以使字体看起来会更清晰舒服。在图标字体成为一种趋势的今天，抗锯齿渲染使用也越来越多。font-smoothing是非标准的CSS定义。它被列入标准规范的草案中，后由于某些原因从web标准中被移除了。但是，我们可以用以下两种定义进行抗锯齿渲染：-webkit-font...
很多人只要一提到@font face规则，心中就会不由自主“哦~~”的一声：“这个我知道，可以用来生成自定义字符小图标！”话是没错，问题在于很多人就以为生成字符小图标就是@font face规则的全部，实际上只是功能之一，如果真正了解@font face规则，你会发现，@font face规则可以做的事情其实非常多，尤其我们不考虑IE7，IE8浏览器的情况下。一、 @font face的本质是变量虽然说CSS3新世界才出现真正意义上的变量var（参见此文：“了解...
如果要用一个词来描述的话，可以把其称为字体变体（Font variants），对应的CSS属性就是font-variation-*属性，其包括连接（ligatures）、大写（caps）、数字（numerals）和替代字形（alternate glyphs）。这些属性可以让我们在Web上创建更精准、更漂亮的排版（文本）效果。事实上，Web上的排版总是要落后于它在它印刷中的效果。但这是可以理解的，因为打印在页面上的字体已经经过几个世纪的发展，可以说发展到一个复杂的程度。而在...