タグ

2015年10月8日のブックマーク (5件)

  • Bootstrapの導入方法&初期設定まとめ | vdeep

    こんにちは、okutani(@okutani_t)です。みなさんはBootstrapを知っていますか?BootstrapTwitterが作ったCSSフレームワークで、ノンデザイナーの方でもオシャレなサイトがかんたんに構築できるスグレモノです。 最近ではBootstrapの解説書が出るくらい、人気のWeb制作ツールですね。また、始めからレスポンシブ対応しているので、かんたんにスマートフォンでも最適に見れるサイトを構築することができます。 スマートフォンユーザーの多い今日では、Bootstrapの使い方を覚えておくだけ損はないですね。 実際に、私はお仕事で管理ページなどを作成するときは、ほとんどBootstrapを使って構築しています。まだBootstrapを使ったことのない方は、この機会に試してみてはどうでしょうか。 今回はBootstrapの導入方法と初期設定をかんたんに紹介します。それ

    Bootstrapの導入方法&初期設定まとめ | vdeep
  • Bootstrap テンプレートは使うべきではないと思う - ボクココ

    最近のはてぶITカテゴリーにしょっちゅう出てくるデザイナー向けBootstrap テンプレート。ペラ1のサイトのコードとDEMOが付随しているので文言を変えるだけで簡単にクールなwebサイトを作ることができる。例えばこんなまとめサイト。 商用も無料!Bootstrapをベースに最近のトレンドを取り入れた新作テンプレートのまとめ | コリス 読んだ人はきっと、「今後作るときはこういうのですぐ作れればいっか!」みたいな感じではてぶ登録するんだろうけど、実際にやってみた身としては逆に効率が悪くなった。なのでこういうのは使うべきではないと思っている。 その唯一の理由。 ちょっと変えるのが大変 最も大きな理由はこれ。自分でCSSを組み立ててないのでどんなCSS設計になっているかを理解するのに時間がかかり、逆に時間が取られるというオチ。 数ページ分くらいなら自分で一から組み立てていったほうが早かったと

    Bootstrap テンプレートは使うべきではないと思う - ボクココ
  • 【Fontello】アイコンを選んでWebフォント化してくれるジェネレータ | DevelopersIO

    SIL Open Font License (OFL) 参考URL : SIL Open Font License (SILオープンフォントライセンス) CC BY 参考URL : 表示 3.0 非移植 (CC BY 3.0)ク CC BY-SA 参考URL : Creative Commons — 表示 - 継承 3.0 非移植 MIT 参考URL : MIT License - ウィキペディア BSD 参考URL : BSDライセンス - ウィキペディア Webフォントアイコンを選んでみる。 http://fontello.com/ それでは、実際に上記サイトへアクセスして使用してみたいと思います。 サイトへ行くと沢山のWebフォントアイコンが用意されています。 Webフォントアイコンの選択 今回は、Webフォントアイコンで有名なFont Awesomeを使ってみたいと思います。 Fo

    【Fontello】アイコンを選んでWebフォント化してくれるジェネレータ | DevelopersIO
  • Add Icon Fonts to Text Links

    2013年3月25日 CSS CSS3を使ったアイコンフォントで、テキストリンクをもう少し華やかに!画像を使うと案外手間がかかるテキスト横のアイコンを、Webフォントを使って簡単に表示させましょう。今回はリンク先や拡張子で異なるアイコンを表示する方法を紹介します。 ↑私が10年以上利用している会計ソフト! アイコンフォントとは? アルファベット1文字に1つのアイコンが設定されているフォントの総称です。サーバー上にあるフォントファイルを読み込んでフォントを表示する「Webフォント」の応用として使われ始めました。今までのような画像を使ったアイコンとは違い、フォントはベクターファイルなので、サイズを大きくしてもギザギザに見えることはありません。つまりiPhoneiPadといった高解像度のディスプレイでも、劣化することなくきれいに表示されます。 ただし!何らかの原因でフォントファイルがダウンロー

    Add Icon Fonts to Text Links
  • CSSの content プロパティーを使いこなそう!

    2015年4月8日 CSS CSSの小技やスニペット集なんかを見ていると、ちょくちょく見かける content プロパティー。「そういえば、こいつ一体何者…!?」と思った方もいるかもしれないので、今更ながら改めて content プロパティーの紹介をしようと思います。 ↑私が10年以上利用している会計ソフト! content プロパティーって何? content プロパティーは、要素の前後に、:before または :after という擬似要素を使ってテキストや画像などのコンテンツを挿入する際に使用します。擬似要素とは、HTMLなどの文書には記述されていない要素をCSSによって新たに作り出された架空の要素です。Webクリエイターボックスでも、過去記事「かつてはJavaScriptを利用していたものの、今ではCSSのみで実装できる10の小技」や「経歴や会社の沿革ページに!簡単なCSSで実装す

    CSSの content プロパティーを使いこなそう!