说到css中的font-family，相信很多朋友经常用，但不知道当你遇到引用中文字体的时候你会怎么写？最近特别关注了下，发现最常用的基本有三种类型：1、直接中文；2、英文形式；3、unicode码；前面两种形式很好理解，unicode码是什么意思呢？下面看基本定义:Unicode（统一码、万国码、单一码）是一种在计算机上使用的字符编码。它为每种语言中的每个字符设定了统一并且唯一的二进制编码，以满足跨语言、跨平台进行文本转换、处理的要求...
@font-face语法规则@font-face {font-family: <YourWebFontName>;src: <source> [<format>][,<source> [<format>]]*;[font-weight: <weight>];[font-style: <style>];}说明：YourWebFontName:此值指的就是你自定义的字体名称，最好是使用你下载的默认字体，他将被引用到你的Web元素中的font-family。如“font-family:"YourWebFontName";”source:此值指的是你自定义的字体的存放路径，可以是相对路径也可以是绝路径；format：此值指...
像下面图中的布局，如果排列的元素是登高的话，相信很多人都会使用浮动来布局，不过如果元素不等高的话，不添加多余的标签，浮动布局是很难实现下图中的效果。如果遇到这种情况，可以使用inline-block来布局。 现代浏览器的最新版都支持inline-block，只有该死的ie6、7不支持inline-block，但ie6、7可以通过 display：inline；zoom：1；来模拟。 下面是inline-block兼容的代码： 复制代码代码如下:display:inline-block;*display:i...
大家都知道现在各个浏览器都支持CSS3的自定义字体(@font-face)，包括IE6都支持，只是各自对字体文件格式的支持不太一样。那么对于网站中用到的各种icon，我们就可以尝试使用font来实现，为什么要将icon做成字体？在很多网站项目中，我们常常会用到各种透明小图标，然后网站要兼容各个浏览器，也可能会有多个尺寸，甚至还要考虑换肤等需求。那么我们就要将这些小图标输出为多种尺寸、颜色和文件格式，比如png8 alpha透明或者png8 in...
思路：1，先做1个正方形，然后旋转45°即可让箭头分别朝向上下左右2，需要那个朝向的箭头就分别设置这个箭头两边边框颜色，如下代码可以实现箭头朝右div {width: 8px;height: 8px;border-top: 1px solid #666;border-right: 1px solid #666;transform: rotate(45deg); } 原文：https://www.cnblogs.com/JeffreyZhu/p/15177160.html
(转)CSS3 @font-facehttp://www.fontsquirrel.com/fontface@font-face是CSS3中的一个模块，他主要是把自己定义的Web字体嵌入到你的网页中，随着@font-face模块的出现，我们在Web的开发中使用字体不怕只能使用Web安全字体，你们当中或许有许多人会不自然的问，这样的东西IE能支持吗？当我告诉大家@font-face这个功能早在IE4就支持了你肯定会感到惊讶。我的Blog就使用了许多这样的自定义Web字体，比如说首页的Logo，Tags以及页面中的...
例1（小米米官网）：font-family: "Arial","Microsoft YaHei","黑体","宋体",sans-serif;例2（淘宝技术研发中心）：font: 12px/1.5 Tahoma,Helvetica,Arial,‘宋体‘,sans-serif;例3（加网 ）：font: 14px/1.5 ‘Microsoft YaHei‘,arial,tahoma,\5b8b\4f53,sans-serif;例4（淘宝UED）：font: 12px/1 Tahoma,Helvetica,Arial,"\5b8b\4f53",sans-serif;例5（一淘UX）:font-family: Helvetica, ‘Hiragino Sans GB‘, ‘Microsoft Ya...
1、什么是字体 字体是文字的外在形式，就是文字的风格，是文字的外衣。比如行书、楷书、草书，都是一种字体。同样一个字每个人写起来都会有差异，可以说每个人都有一套潜在的字体库。对于web页面来说，字体就是计算机上存储的一套文字显示方式。通过对文字进行一些特殊处理（比如末端加强）来提高不同环境中文字的可读性。 比如同样大小的文字，在不同字体下的可读性是不同的。一般来讲，一款字库的诞生，要经过字体设计师的...
在设计布局网页时 经常想要用一些比较好看的字体，比如微软雅黑，这个字体在近年来在网页设计中运用越来越平常， 然而所使用的字体也只有自己能看到 到别的机子上 又恢复了原来的宋体神马的。经过一位高手的提点，能用CSS直接实现，查阅了部分资料 并经过测试 总结下列方法来实现网页中的自定义字体我们很容易发现EOT字体仅仅对于IE浏览器支持 面对庞大的ＩＥ用户 ＥＯＴ字体的重要性也就不说了对于其他浏览器由于直接支持TTF字体...
@font-face是CSS3中的一个模块，他主要是把自己定义的Web字体嵌入到你的网页中，随着@font-face模块的出现，我们在Web的开发中使用字体不怕只能使用Web安全字体。可能有人要问，使用这种字体，IE兼容性怎么办，那就大错特错了，@font-face甚至向下兼容到IE4，想想看自己的页面上能有自己自定义的字体是一件多么帮的事情啊，现在贴出一点学习过程与大家分享 首先选一款你要用的字体，有免费下载的或者付费购买的（我反正是下免费...
一般设置字体，个人都喜欢用中文，比如：font-family:"微软雅黑"；但是偶尔会出现设置以后字体显示乱码的问题 解决方法【1】：看看你的CSS文件的第一行有没有：@charset "utf-8";如果有，再另存为一次，保存的文件编码要和上面声明的一致 如果没有，就把乱码改为正确的字，保存再打开，看看还有没有乱码。 如果是在项目里面的CSS文件出现类似的问题，查看一下CSS文件设置的字体是否是utf-8，如下图 解决方法【2】： ...
Font（字体）属性CSS Font（字体）属性用于定义字体系列、大小、粗细、和文字样式等。font-family（字体系列）CSS使用font-family属性定义文本的字体系列。各个字体之间必须使用英文逗号隔开一般情况下，如果有空格隔开的多个单词组成的字体，加引号。尽量使用系统默认自带字体，保证在任何用户的浏览器中都能正常显示最常见的几个字体：body{font-family: ‘Microsoft YaHei‘, tahoma, Arial, ‘Hiragino Sans GB‘}示例代码：<!...
CSS3 Shadow Effectstext-shadowbox-shadow1> text-shadowThe text-shadow property adds shadow to text.This property accepts a comma-separated list of shadows to be applied to the text.syntaxtext-shadow: h-shadow v-shadow blur-radius color|none|initial|inherit;ValuesValueDescriptionh-shadowRequired. The position of the horizontal shadow. Negative values are allowedv-shadowRequired. The position of the...
解决@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、...