网页使用Google Font API(字体)的方法
在网页设计里,字体的显示是个问题。最普遍用的是宋体,但是宋体在 Win 7 下的表现真的很难看。雅黑端庄一些,但是随着字体大小,感觉汉字的大小也会有区别。小站现在用的字体是是宋体 + Arial/Georgia,因为习惯了也没多在意,其实对于英文字体有其它更好的选择。
比如 Bitter 字体,用来做标题倒是不错:
代码如下:
<div style="text-align:center; font-size:24px; font-family:Bitter;">Welcome To NowaMagic.net</div>
@font-face {
font-family: 'Bitter';
font-style: normal;
font-weight: 400;
src: local('Bitter-Regular'), url(http://themes.googleusercontent.com/static/fonts/bitter/v4/s9gJB935qk_YG8d-lnTdvA.woff) format('woff');
}
@font-face {
font-family: 'Bitter';
font-style: normal;
font-weight: 700;
src: local('Bitter-Bold'), url(http://themes.googleusercontent.com/static/fonts/bitter/v4/JGVZEP92dXgoQBG1CnQcfD8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}
其实,这是 Google 推出的Google Font Directory和Google Font API两项服务,Google联合了众多的字体设计者为用户提供了多种漂亮的字体。具体可以参看以前写的一篇文章:《用Google Font API来丰富网页字体》。
这里仅仅抛砖引玉,国内实在太少网站用 Google Font API 了。
相关推荐
-
网页使用Google Font API(字体)的方法
在网页设计里,字体的显示是个问题.最普遍用的是宋体,但是宋体在 Win 7 下的表现真的很难看.雅黑端庄一些,但是随着字体大小,感觉汉字的大小也会有区别.小站现在用的字体是是宋体 + Arial/Georgia,因为习惯了也没多在意,其实对于英文字体有其它更好的选择.比如 Bitter 字体,用来做标题倒是不错: 复制代码 代码如下: <div style="text-align:center; font-size:24px; font-family:Bitter;">We
-
PHP访问Google Search API的方法
本文实例讲述了PHP访问Google Search API的方法.分享给大家供大家参考.具体如下: 这段代码段演示了如何从php向AJAX搜索API发送请求.请注意,此示例假定使用 PHP 5.2.对于较早安装的 PHP,请参考对应的官方注释. 具体代码如下: 复制代码 代码如下: $url = "http://ajax.googleapis.com/ajax/services/search/web?v=1.0&q=Paris%20Hilton"; // sendReque
-
js给网页加上背景音乐及选择音效的方法
本文实例讲述了js给网页加上背景音乐及选择音效的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <HTML> <HEAD> <TITLE>给网页加上背景音乐,选择音效功能</TITLE> <STYLE> <!--样式单 --> a{font-size:30pt;color:blue;font-family:Vineta BT} a:link{text-decoration:none;} a:hover{text-
-
使用httpclient实现免费的google翻译api
由於Google translate API要收錢 ,因此想了一個偷機的方法 1. 用HttpClient發送一個request給http://translate.google.com 2. 再用Jsoup來parse html, 並取出翻譯後的文字 复制代码 代码如下: /** * Copyright (c) blackbear, Inc All Rights Reserved. */package org.bb.util.i18n; import java.io.InputStream;im
-
js+html5获取用户地理位置信息并在Google地图上显示的方法
本文实例讲述了js+html5获取用户地理位置信息并在Google地图上显示的方法.分享给大家供大家参考.具体实现方法如下: <!DOCTYPE html> <html> <body> <p id="demo">Click the button to get your position:</p> <button onclick="getLocation()">Try It</button&
-
Python基于pygame实现的font游戏字体(附源码)
本文实例讲述了Python基于pygame实现的font游戏字体.分享给大家供大家参考,具体如下: 在pygame游戏开发中,一个友好的UI中,漂亮的字体是少不了的 今天就给大伙带来有关pygame中字体的一些介绍说明 首先我们得判断一下我们的pygame中有没有font这个模块 复制代码 代码如下: if not pygame.font: print('Warning, fonts disabled') 如果有的话才可以进行接下来的操作:-) 我们可以这样使用pygame中的字体: 复制代码
-
C#实现缩放字体的方法
本文实例讲述了C#实现缩放字体的方法.分享给大家供大家参考.具体实现方法如下: using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Text; using System.Windows.Forms; using System.Drawing.Drawing2D; namespace adv
-
JS实现网页表格自动变大缩小的方法
本文实例讲述了JS实现网页表格自动变大缩小的方法.分享给大家供大家参考.具体分析如下: 这就是一个个性的动态表格效果代码,网页中的表格自动放大或者缩小,不停的变化 主要就是一个强调显示的作用 复制代码 代码如下: <HTML> <HEAD> <TITLE>js会动的表格</TITLE> <META content="text/html; charset=hz-gb-2312" http-equiv=Content-Type>
-
JavaScript控制网页层收起和展开效果的方法
本文实例讲述了JavaScript控制网页层收起和展开效果的方法.分享给大家供大家参考.具体如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <meta http-equiv="pragma" content=&q
-
Google Map Api和GOOGLE Search Api整合实现代码
将GOOGLE MAP API 和 GOOGLE Search API 进行整合,我用面向对象的方式写了一个类,通过传一个经纬度进去,自动通过GOOGLE LOCAL SEARCH获取附近的相关信息.比如餐厅.景点等,反过来标到地图上,并可在任意容器内显示. 下面是源码: 复制代码 代码如下: /* *Author:karry *Version:1.0 *Time:2008-12-01 *KMapSearch 类 *把GOOGLE MAP 和LocalSearch结合.只需要传入MAP\经纬度值
随机推荐
- PowerShell小技巧之使用Verb打开程序
- jQuery 3.0中存在问题及解决办法
- Ubuntu设置开机自动挂载所有格式硬盘分区
- python去掉字符串中重复字符的方法
- Canvas 制作动态进度加载水球详解及实例代码
- 基于bootstrap实现收缩导航条
- 微信公众号 摇一摇周边功能开发
- 整理的一些实用WordPress后台MySQL操作命令
- Python自定义scrapy中间模块避免重复采集的方法
- JavaScript DOM 学习第五章 表单简介
- PHP获取当前日期及本周一是几月几号的方法
- php中时间函数date及常用的时间计算
- JQuery的Ajax跨域请求原理概述及实例
- 十二星座节日送礼指南
- jquery xMarquee实现文字水平无缝滚动效果
- MongoDB 使用Skip和limit分页
- SQL SERVER 2000安装教程图文详解
- jquery 无限极下拉菜单的简单实例(精简浓缩版)
- javascript判断用户浏览器插件安装情况的代码
- 第十三节 对象串行化 [13]
其他
- pgsql启动报错连接失败
- OAUTH2单点注销不带token
- jquery动态添加表格数据
- 怎么把element-UI封装成公司自己的框架
- opencv-python图像拼接
- 小程序 rich-text img
- js宽度跟随鼠标变化
- r语言中summary函数的作用
- vue3 已知图片连接,下载图片
- pytorch 防止过拟合
- android美化控件
- mybatis产出超时
- 批处理怎么复制ini文件
- vue3 eslint将错误降级为警告
- pycharm关掉中文
- pycharm连接远程服务器jupyter
- 用脚本语言计算两个指定日期之间工作日的数量
- shell 判断结果是否是数字
- python 打开多个输入框获取输入
- C# datatable数量