さあ、フォントの数をかぞえろ！ ささやかですが、KAYAC DESIGNER'S BLOGがリニューアルしました。 せっかくのリニューアルなので、どうせなら遊んでみようと思いまして、 表示するたびにフォントが変わる仕掛けを盛り込んでみました。 このページをリロードしてみてください。 ロゴやナビゲーションのフォントが変わってると思います。 ということで、今回はその解説をしたいと思います。続きからどうぞ！ 今回はGoogle Font APIを使って外部フォントを読み込んでいます。 使い方 使いたいフォントを選びます。 Google Font Directory 詳細画面でいろいろチェックできて便利ですね。 使いたいフォントが見つかったら「Get the code」をクリックしましょう。 この画面に書いてあるCSSを設定すればフォントが適用されます。 簡単すぎてびっくりしますね。 フォントをラ
タグ
- すべて
- 2ch (70)
- 3d touch (21)
- AMD (32)
- APFS (26)
- ARC (26)
- ARKit (23)
- ARM (109)
- ATOK (79)
- AVFoundation (17)
- AirPlay (21)
- AlphaGo (19)
- Ansible (17)
- AppStore (41)
- Apple Pay (23)
- Apple TV (34)
- Apple Watch (96)
- AutoLayout (15)
- CI (88)
- CTO (31)
- CocoaPods (67)
- CoreAnimation (20)
- CoreAudio (15)
- CoreData (69)
- CoreText (16)
- DNS (117)
- Dart (25)
- DeNA (16)
- Electron (120)
- Elixir (21)
- FPGA (40)
- GNU (26)
- Google+ (22)
- GraalVM (22)
- GraphQL (31)
- H2O (18)
- HPC (46)
- Heroku (55)
- HomeKit (16)
- Homebrew (32)
- IRC (17)
- Intel (89)
- IoT (16)
- JIT (85)
- LINE (24)
- MacAppStore (21)
- MachineLearning (44)
- MapKit (16)
- Netflix (17)
- Nintendo (72)
- NoSQL (51)
- OAuth (40)
- OpenGL (17)
- Pokemon Go (29)
- R (16)
- ReactNative (56)
- ReactiveCocoa (15)
- Realm (19)
- SDK (31)
- SIMBL (25)
- SSL (93)
- Silverlight (17)
- Storyboard (33)
- TensorFlow (37)
- TestFlight (28)
- TouchBar (21)
- TypeScript (35)
- UITableView (18)
- UIView (15)
- UIWebView (44)
- VMWare (23)
- WWDC (45)
- WatchKit (23)
- WebAssembly (124)
- WebSocket (39)
- Xamarin (30)
- actionscript (61)
- ad (27)
- adobe (99)
- ai (63)
- air (46)
- ajax (101)
- alfred (34)
- algorithm (291)
- amazon (159)
- android (905)
- animal (77)
- anime (60)
- apache (113)
- api (327)
- apple (1623)
- applescript (59)
- architecture (35)
- art (22)
- astronomy (90)
- atom (60)
- au (17)
- automator (23)
- aws (126)
- baidu (26)
- battery (15)
- benchmark (175)
- blocks (25)
- blog (73)
- bluetooth (45)
- book (678)
- bookmark (17)
- bookmarklet (49)
- browser (143)
- bsd (23)
- bug (81)
- business (300)
- c (250)
- c# (25)
- c++ (325)
- camera (109)
- car (57)
- career (23)
- cassandra (19)
- cat (134)
- cdn (16)
- charset (50)
- chat (17)
- chef (40)
- cinema (19)
- clang (96)
- cloud (125)
- cocoa (190)
- cocos2d (38)
- codec (45)
- coffeescript (32)
- comic (73)
- command (230)
- communication (140)
- compiler (58)
- computer (30)
- cookie (15)
- cookpad (217)
- copyright (51)
- cpu (302)
- cron (17)
- css (518)
- css3 (43)
- csv (19)
- dashboard (19)
- db (183)
- debug (275)
- deeplearning (62)
- deploygate (18)
- design (469)
- development (738)
- dictionary (16)
- diff (30)
- display (41)
- docker (267)
- document (133)
- dropbox (119)
- dtrace (30)
- ebook (218)
- editor (89)
- education (58)
- emacs (634)
- emoji (19)
- energy (79)
- engineer (133)
- english (466)
- epub (100)
- esa (71)
- evernote (82)
- excel (23)
- extension (422)
- facebook (147)
- fastlane (17)
- ffmpeg (28)
- filesystem (53)
- finance (42)
- finder (26)
- firebug (51)
- firefox (933)
- flash (335)
- fluentd (44)
- font (510)
- framework (133)
- freebsd (78)
- ftp (24)
- gadget (87)
- game (650)
- gc (157)
- gcc (149)
- gcd (27)
- gdb (45)
- gimp (46)
- git (623)
- github (698)
- gitlab (34)
- gmail (195)
- go (259)
- google (1152)
- google analytics (53)
- google app engine (70)
- google buzz (32)
- google chrome (550)
- google chrome os (57)
- google docs (22)
- google earth (28)
- google ime (47)
- google maps (144)
- google reader (19)
- google wave (21)
- gpgpu (81)
- gps (39)
- gpu (117)
- graph (64)
- greasemonkey (55)
- gree (32)
- growl (44)
- hack (46)
- hadoop (95)
- hardware (77)
- haskell (21)
- hatena (505)
- health (107)
- history (230)
- hotcocoa (24)
- html (83)
- html5 (296)
- http (143)
- http2 (20)
- https (40)
- iBeacon (57)
- iOS (2915)
- iOSDC (52)
- ibm (22)
- icloud (34)
- icon (414)
- ie (254)
- illustrator (43)
- image (116)
- imagemagick (15)
- ime (35)
- infrastructure (37)
- ingress (46)
- ipad (418)
- iphone (1027)
- ipod (35)
- ipod touch (84)
- ipv6 (32)
- itunes (195)
- jailbreak (52)
- java (345)
- javascript (1423)
- jenkins (165)
- jquery (287)
- jruby (81)
- json (57)
- kafka (32)
- keyboard (34)
- kindle (43)
- kotlin (58)
- kvs (64)
- law (60)
- library (518)
- license (60)
- life (122)
- lifehack (298)
- linux (877)
- lisp (41)
- livedoor (28)
- lldb (26)
- llvm (341)
- lua (16)
- mac (2957)
- macfuse (16)
- macports (17)
- macruby (281)
- mail (109)
- make (15)
- malloc (27)
- management (370)
- map (33)
- markdown (83)
- marketing (70)
- math (106)
- medical (66)
- memcached (27)
- messagepack (15)
- microsoft (325)
- mixi (148)
- mobile (238)
- mobiruby (18)
- money (25)
- monitoring (15)
- movie (185)
- mozilla (183)
- mruby (228)
- music (273)
- mysql (260)
- nacl (18)
- nature (36)
- network (311)
- neural network (33)
- news (33)
- nginx (67)
- niconico (32)
- node.js (95)
- objective-c (675)
- office (32)
- opencv (37)
- openflow (21)
- openid (36)
- openoffice.org (18)
- opera (336)
- optimization (17)
- os (121)
- oss (361)
- p2p (51)
- parallel (15)
- parse (26)
- patent (74)
- pdf (118)
- peco (34)
- performance (451)
- perl (384)
- photo (317)
- photoshop (584)
- php (599)
- pixate (26)
- pixiv (19)
- plagger (28)
- playstation (30)
- playstation3 (86)
- plugin (135)
- podcast (28)
- politics (35)
- postgresql (71)
- presentation (114)
- product (16)
- programmer (29)
- programming (1068)
- project (62)
- protocol (22)
- proxy (28)
- psp (47)
- push notification (53)
- python (301)
- qiita (106)
- quicklook (47)
- quicksilver (31)
- rack (18)
- radio (43)
- rails (991)
- react (125)
- redmine (32)
- reference (77)
- regex (70)
- research (28)
- review (60)
- rspec (40)
- rss (25)
- rubocop (80)
- ruby (4310)
- rubycocoa (79)
- rubygems (81)
- rubykaigi (546)
- rubymine (30)
- rubymotion (652)
- rust (255)
- safari (479)
- samba (20)
- scala (51)
- science (628)
- screen (47)
- script (16)
- scrum (66)
- search (89)
- second life (45)
- security (1737)
- seo (141)
- server (77)
- service (39)
- shell (157)
- siri (26)
- sketch (24)
- skype (51)
- slack (108)
- sns (24)
- softbank (23)
- software (101)
- solaris (18)
- sony (22)
- sound (72)
- spam (36)
- spdy (47)
- specification (17)
- sports (43)
- spotlight (26)
- sql (99)
- sqlite (58)
- ssd (47)
- ssh (52)
- statistics (35)
- storage (117)
- study (37)
- sublime (107)
- subversion (82)
- svg (36)
- swift (811)
- technology (390)
- terminal (92)
- test (390)
- tex (30)
- thunderbird (38)
- thunderbolt (33)
- tips (116)
- titanium (37)
- tmux (43)
- tool (722)
- travel (48)
- travis (33)
- tutorial (73)
- tv (42)
- tvOS (19)
- twitter (532)
- ubuntu (39)
- ui (234)
- uiimage (22)
- unicode (106)
- unity (24)
- unix (24)
- usb (44)
- ustream (22)
- ux (42)
- vagrant (36)
- video (75)
- vim (198)
- vimperator (51)
- virtualbox (27)
- visual studio (15)
- vscode (96)
- wallpaper (65)
- watchos (21)
- web (449)
- webgl (36)
- webkit (193)
- webm (42)
- webservice (509)
- wifi (105)
- wiki (20)
- wikipedia (19)
- windows (520)
- wine (29)
- wolfram (19)
- work (115)
- writing (30)
- xcode (440)
- xss (22)
- xyzzy (20)
- yahoo (78)
- youtube (160)
- zaim (19)
- zfs (56)
- zsh (108)
- あとで読む (19)
- まとめ (55)
- エイプリルフール (16)
- ネタ (435)
- 形態素解析 (34)
- 東日本大震災 (88)
- 素材 (76)
- 色 (57)
- 読み物 (33)
- 雑学 (115)
- 食 (341)
- ruby (4310)
- mac (2957)
- iOS (2915)
- security (1737)
- apple (1623)
- javascript (1423)
- google (1152)
- programming (1068)
- iphone (1027)
- rails (991)
apiとfontに関するWatsonのブックマーク (5)
-
Watson 2010/08/01
- font
- api
リンク -
hamashun me : Google Font Directory のフォントがiPhoneやiPadに未対応な件に取り急ぎ対応する方法
ついにWeb Fontsの実用時代到来か！？ と思われたGoogle Font Directoryですが、2010年5月31日現在ではiPhoneやiPadなどでは未対応です。 ただ未対応なだけならまだいいのですが、webfontが英語だけだと日本語の場所空白っぽい感じで表示されるみたいです。という報告をスクショ付きで @cv_k さんから頂きました（ありがとうございます！）。 TwitPic 加えて、@tacamy という清純派マークアッパーから「あらあらうふふ。iPhone対応するとか言ってたのはどの口かしら？」と罵られたので、取り急ぎ対応した次第であります。 対応前と対応後のコードは以下です。 Before body { font-family: Inconsolata, sans-serif; } After body { font-family: 'Hiragino Kaku G
-
Google Font API のウェブフォントを使うと iPhone で日本語が表示されない理由 | ブログ | SINAP - 株式会社シナップ
この記事の最初の公開後、さらに調査を続けていたところ、内容に不正確な部分があることがわかりましたので、訂正いたしました。詳細は本文中の追記・訂正をご覧ください。（2010/06/01） 先日、Google から、画期的なウェブフォントサービスの Google Font API が発表されました。既にたくさんの方々が、様々な実験をしたり記事を書いたりいらっしゃいますが、そんな昨日。 「Google Font API で日本語が表示出来ない」という話を小耳に挟みました。 もとより、Google Font API で提供されるフォントは現時点では欧文フォントのみで、日本語の字形データは含んでいませんが、仮にそうしたフォントが日本語を含む文字列に指定されたとしても、本来そこで期待されるのは「指定フォントで表示できない文字は、表示できる別のフォントで表示する」という挙動であって、真っ白になってしまう
-
-
Google Font API - Google Code
How do I start? Read the Getting Started guide. Choose fonts from the Font Directory. Optionally, use the WebFont Loader library for more control over font loading. What are the Google Font API and the Google Font Directory? The Google Font Directory provides high-quality web fonts that you can include in your pages using the Google Font API. The Google Font API helps you add web fonts to any web
-
1
公式Twitter
- @HatenaBookmark
リリース、障害情報などのサービスのお知らせ
- @hatebu
最新の人気エントリーの配信
処理を実行中です
キーボードショートカット一覧
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
設定を変更しましたx