【css】Webフォント、ローカルフォントの指定方法 at softelメモ
Webフォントやローカルにあるフォントファイルを使ってテキストを表示したいときは、以下のような書き方になる。 @font-face { font-family: 'MyFont'; src: url(/location/of/font/myfont.ttf); } body { font-family: MyFont; } @font-face { font-family: 'MyFont'; src: url('webfont.eot'); /* IE9 Compat Modes */ src: local('myfont Regular'), /* フォントがローカルにインストールされている場合に有効 */ url('webfont.eot?#iefix') format('embedded-opentype'), /* eof - IE6-IE8 */ url('webfont.wo
CSSで作るシンプルな矢印アイコン29個 | 株式会社プレスマン
最近ではCSS3の対応ブラウザが増えたおかげで、画像を使わずともサイト上で色々な表現ができるようになりました。 CSSでデザインの実装を行う場合、｢カスタマイズやメンテナンスが容易」｢レスポンシブWebデザインとも相性が良い」｢画像を読み込まないのでモバイルユーザーにも優しい」｢Retinaディスプレイなど高解像度の環境で見ても綺麗」等、制作側とユーザーの両方にメリットがあります。 今回は、フラットデザインのWebサイトなどでよく見かける、シンプルな矢印アイコンのCSSをいくつかご紹介したいと思います。 目次： 共通HTML＆CSS シンプルな矢印アイコン シンプルな矢印アイコン シンプルな矢印アイコン（大） シンプルな太い矢印アイコン シンプルな太い矢印アイコン（大） 斜めの矢印アイコン 右上向きの矢印アイコン 右上向きの矢印アイコン（大） 右下向きの矢印アイコン 右下向きの矢印アイコン
CSSアニメーションを使いこなすために知っておきたい5つのこと - Qiita
はじめに keyframesを使ったCSSアニメーションは描画パフォーマンスが良く、ヌルヌルな動きが簡単に実装できます。 最近旧IEのサポートが切られたこともあり、今後は触る機会もより増えてくるかと思います。 そこでCSSアニメーションをガリガリ使っていく上で、これは覚えておきたい！と思ったことをまとめてみました。何かの参考にでもなれば幸いです。 基本的なプロパティや使い方などは省略します サンプルコードではprefixを省略しています 5つとは単に私が思いついた数なので、深い意味はありません 目次 はじめに 複雑なイージングはChrome Devtoolsで簡単に実装できる イージングはkeyframesの中で細かく再定義できる カンマ区切りでシーケンシャルに表現する コマ送りアニメーションにはsteps()が便利 アニメーションのcallback（イベント）を取得する 終わりに 複雑な
知っていると幸せになれるかもしれないChromeDevtoolsの小技集 ～CSS開発編～ - Qiita
はじめに 私は開発ブラウザにChromeを使っています。Devtoolsは心の友です。 ですがまだまだ使いこなせていません。今回CSS周りで使える機能を改めて調べてみたので、それをメモとして記事にしたいと思います。 特にあまり知られていないかもしれない機能で便利そうなものをピックアップしてみました（独断）。 何かのお役に立てば幸いです。 動作環境はChrome 45.0.2454.85 m（2015/09/11時点 最新ver）です ショートカットキーはWindowsのものです（Macは脳内で置き換えて下さい） 目次 Elementsタブ Stylesパネル編 擬似クラスの発動・固定 Undo Redo 上下キーで数値の増減 カラーパレット機能 アニメーション速度をリアルタイムに変更 イージングの簡単設定 Sourcesへのダイレクト移動 Sourcesタブ編 リビジョン管理 ショートカッ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
