这个指南解释了如何使用Google Font的API,把网络字体添加到自己的页面上。你不需要任何的编码,你所要做的只是添加一个特定的CSS到HTML页面上，然后把字体关联到这个CSS样式。一个快速的例子： 这是一个例子，复制下面的HTML代码到一个文件中： Html代码 body { font-family: 'Tangerine', serif; font-size: ...
原文摘自我的前端博客，欢迎大家来访问 http://hacke2.github.io/ 起因 实验室马上要出去找工作了，大家想写一个展示自己项目的东西，没必要做的太复杂，我就把这几天学到的结合了一下，算是做了 一个大概的样子出来，大家可以自己放里面加内容 点击右上角项目名称可切换不同视图 所含的技术 AngularJs 里面MVC使用AngularJs来实现，主要用了其中两个技术： 1.模板技术 2.路由技术 之所以用了AngularJs的路由技术，...
font:inherit 字体的设置 设置所有元素的字体保持一致： 所有元素：*{font:inherit;} /* IE8+ */ body体用percent：body{font:100%/1 sans-serif;} 其余用em：div{font-size:1.2em;} 参考： css-font-size-em-vs-px-vs-pt-vs css inherit
@font-face语法规则 @font-face { font-family: ; src: [][, []]*; [font-weight: ]; [font-style: ]; } 说明： YourWebFontName:此值指的就是你自定义的字体名称，最好是使用你下载的默认字体，他将被引用到你的Web元素中的font-family。如“font-family:"YourWebFontName";” source:此值指的是你自定义的字体的存放路径，可以是相对路径也可以是绝路径； format：此值指的是你自定义的字体的格式...
HTML 1 2 li*5>a[href=#]>i.icon 3 4 5 6 7 8 9 10 11 12 CSS 1 2 * {margin:0; padding:0;} 3 body { background-color: #fc0; padding-top: 50px;} 4 ul li { list-style: none;} 5 a { text-decoration: none;} 6 .clear { clear:both;} 7 .layout { width:604px; m...
CSS属性之字体(Font) font：[ [ <font-style> || <font-variant> || <font-weight> ]? <font-size> [ / <line-height> ]? <font-family> ] 复合属性，各属性见下文。 必须同时包含font-size和font-family，且这两个值顺序不能变，其他关键字的值放到这两个值的前面，顺序可以随意打乱。 可以在字号值(font-size)上放一个可选的行高值(line-height)作为字号的某种附属值，后面必须有font-family。 font-style:norma...
说到css中的font-family，相信很多朋友经常用，但不知道当你遇到引用中文字体的时候你会怎么写？最近特别关注了下，发现最常用的基本有三种类型： 1、直接中文； 2、英文形式； 3、unicode码； 前面两种形式很好理解，unicode码是什么意思呢？下面看基本定义: Unicode（统一码、万国码、单一码）是一种在计算机上使用的字符编码。它为每种语言中的每个字符设定了统一并且唯一的二进制编码，以满足跨语言、跨平台进行文本转换...
em 1em = 元素自身设定的或是父元素继承的font-size值 1 left margin = 24px2 left margin = 18px3 left margin = 12px 1 h1{font-size:24px;}2 h2{font-size:18px;}3 p{font-size:12px;}4 h1,h2,p{margin-left:1em;} font-weight 值100~900并没有固定的加粗度，一般与某个变形名等价，400对应normal，700对应bold，其他视关键字情况而定。 Times假想加粗指定 字体 指定关键...
最近在进行公司的wap端首页改版和添加活动页面，为了做的效果更好一些，就参考淘宝和京东的wap版，然后对淘宝的wap做了一些分析，淘宝的wap触屏版做的自适应和兼容性很不错，于是整理了下。 wap手机端页面根据dpr和宽度计算出font-size对应数值表如下： dpr 最小宽度320px 最大宽度540px 系数 1 20px 33.75px 0.0625 2 40px 67.5px 0.125 3 60px 101.25px ...
CSS Sprites+CSS3 Icon Font CSS Sprites在国内很多人叫CSS精灵，是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去，这样一来，当访问该页面时，载入的图片就不会像以前那样一幅一幅地慢慢显示出来了。根据具体图标在大图上的位置，给背景定位。 CSS Sprites加速的关键，不是降低质量，而是减少个数。 做成Sprites的很大的原因是图片流量大，想象一下，如果将一...
发现一个奇怪的现象：(http://m.muzhiwan.com) 这里面的图标竟然不是一张张小图标图片？Firebug下查看一下元素，竟然是这样的： 页面源代码如下： 好奇怪啊，这些个乱七八糟的xxx难道就是对应的图标？于是产生了好奇心，百度一下，发现原来这是矢量图标字体！ 使用icon font来生成图标相对于基于图片的图标来说，有如下的好处：1.自由的变化大小2.自由的修改颜色3.添加阴影效果4.IE6也可以支持5.支持图片图标的其...
网站部署到服务器后，在css中设置好了字体，但是在客户那边显示的却是宋体或其他的默认安全字体，这是因为客户端没有相应的字体库导致的。 要想客户端成功显示服务器端的字体的话，可以使用CSS样式@font-face{}来实现。 具体的实现方法请看代码： @font-face { font-family:锐字云水柱体; src:url(锐字云水柱体.eot); src: url(锐字云水柱体.eot?#iefix) format(embedded-opentype), /* IE6-IE8 */ url(锐...
同时声明中文字体的字体名称（英文）和显示名称（中文）： font-family:SimSun,"宋体"; font-family:"Microsoft YaHei","微软雅黑"; font-family:STXihei,"华文细黑","Microsoft YaHei","微软雅黑"; 永远不要忘记声明英文字体，并且英文字体应该在中文字体之前 Font-family: Georgia, SimSun, “宋体” 在最后补充英文字体族的名称。字体族大体上分为两类：非衬线sans-serif和衬线serif font-family:Georgia...
http://files.cnblogs.com/files/LoveOrHate/font.rar @font-face { font-family: Glyphicons Regular; src: url(../font/glyphicons-regular.eot); src: url(../font/glyphicons-regular.eot?#iefix) format(embedded-opentype), url(../font/glyphicons-regular.woff2) format(woff2), url(../font/glyphicons-regular.woff) format(woff), url(../font/glyphicons-regular.ttf) format(truetype), url(../fonts/glyphi...
CSS 参考手册 实例 在一个声明中设置所有字体属性： p.ex1 { font:italic arial,sans-serif; }p.ex2 { font:italic bold 12px/20px arial,sans-serif; } 亲自试一试 浏览器支持 IE Firefox Chrome Safari Opera 所有浏览器都支持 font 属性。 注释：任何的版本的 Internet Explorer （包括 IE8）都不支持属性值 "inhe...