MetroライクなTwitter Bootstrap用デザインテーマ･CosmoMetroライクなデザインに変更 できるTwitter Bootstrapのテ ーマ・Cosmoのご紹介です。 Bootstrapはレイアウトが上手く 出来ているので見た目を変える だけで十分かもしれないですね。 MetroっぽいTwitter Bootstrap用テーマです。
Twitter Bootstrapを使ってブログリニューアルしてみた | 学び続けるweb制作者の独り言
2012年12月08日 かてごり：Bootstrap, jQuery, twitter Twitter Bootstrapとは、Twitter社で開発されたCSSフレームワークです。簡単に言うとサクッとTwitterのようなWEBページが作れるように、デザインやレイアウトが準備されているといった感じです。今回このブログもTwitter Bootstrapでリニューアルしてみました。所要時間は５時間くらいでしょうか。すべてを使いこなせたわけではないし、初めて使ったのでこんなもんでしょうw Twitter Bootstrapを使ってみる Twitter Bootstrapを使用するには、まずTwitter Bootstrapの公式サイトからパッケージをダウンロードします。 サイトにパッケージを設置する 設置は簡単です。まずダウンロードしたzipを解答します。「css」、「js」、「img」を開
Bootstrap
Introducing Google Bootstrap. Need reasons to love Google Bootstrap? Look no further. By nerds, for nerds. Forked from Twitter Bootstrap, built by todc, Google Bootstrap utilizes LESS CSS, is compiled via Node, and is managed through GitHub to help nerds do awesome stuff on the web. Made for everyone. Bootstrap was made to not only look and behave great in the latest desktop browsers (as well as I
Bootstrapを使ったサイトに組み込みたいWYSIWYGエディタ·Bootstrap-wysihtml5 MOONGIFT
Bootstrap-wysihtml5はTwitter Bootstrapで使えるWYSIWYGエディタです。 最近よく目にするようになったTwitter Bootstrapを使ったWebサイト。そんなWebサイトでWYSIWYGエディタを使うならば導入したいのがBootstrap-wysihtml5です。 Bootstrapらしい、すっきりとしたUIです。 漢字を変換した後の動きがちょっと妙です。 テキストのヘッダー変換があります。 リストや装飾もあります。 Bootstrap-wysihtml5は現時点では日本語を入力する際の変換処理を行った後、表示がずれてしまうことがあります。しかしそれさえ修正すればBootstrapとマッチしたデザインで利用できる場面が多いのではないでしょうか。 Bootstrap-wysihtml5はHTML5/JavaScript製、GPLのオープンソース・ソ
お手軽！Bootstrapのカラーテーマを画像から作成する·Lavish MOONGIFT
Lavishは任意の画像を解析してカラーパターンを抽出し、それをBootstrapに適用するソフトウェアです。 Bootstrapは便利なデザインフレームワークですが、色のバランスが特徴的なのでかなり臭いが残ってしまいます。そこで色合いをがらっと変える際に使ってみたいのがLavishです。 トップページです。右側に画像が表示されていますが、その画像を色分析して特徴的な色をピックアップ、Bootstrapのテーマに合わせています。 別な画像を指定してみました。ぐっと色合いが変化しているのが分かります。 こんな色合いも。 ちょっと落ち着いた感じ。 Googleロゴで試してみました。あまりらしくないかな？ Lavishは画像をベースにカラーテーマを設定してくれます。気に入った写真からWebサイトのデザインを決めるというのはなかなかユニークです。取り込んだ後、個別に調整もできるので色々試してみると
Modern Syntax
さて、モダシンラジオのデータをホスティングしてもらっているSpotify for Podcasters(旧Anchor）の私のページはこちらです。 https://anchor.fm/kazuyoshi-nagasawa このSpotify for PodcastersページのRSSは以下になります。こちらのRSSではenclosureタグなどでlength値などがしっかり入っているのでこれを購読しておくとよいかと思います。 https://anchor.fm/s/66ff2830/podcast/rss ここで聴く！という人は以下のプレイヤーからどうぞ。 音声データはGoogle Driveにもアップロードしていますので、こちらをaudioタグを使って聴けるようにもしました。 で、Spotify for Podcastersにデータをアップロードすると以下のPodcastサービスにも自動
Font Awesome を使ってみた | rockf.es blog
今開発中のストーリーボードでは Twitter Bootstrap を Less で使用している。 UIで使うアイコンはデフォルトのGLYPHICONSで、便利だし綺麗だし最高だなーと思っていた。 のだけど、たまたま使いたかったアイコンの絵柄が不足していたりで代わりになるものを探してみたところ、Font Awesomeというプロジェクトの評判が良いらしい。 Font Awesomeとは Bootstrapではアイコンが一つにまとまったPNG画像をCSSスプライトして使うんだけど、Font Awesomeでは名前の通りアイコンをweb font化したものを使う。仕組みからして違う。 ただし、マークアップはBootstrapと共通なので導入さえしてしまえば、既存のHTMLに変更はほとんど発生しない。 またフォントなので、拡大・縮小しても画像は劣化しずらく使い勝手は向上する、はず。 導入 「Do
200を越えるアイコンが揃ったBootstrap向けWeb Font·Font Awesome MOONGIFT
Font AwesomeはBootstrapと組み合わせて使えるアイコンを集めたWeb Fontです。 Twitter Bootstrapの便利な機能の一つにアイコンパックがあります。ちょっとした装飾を手軽に付け加えられるのは便利です。そんなBootstrapに200以上のアイコンを追加するのがFont Awesomeです。Web Fontで作られたアイコンパックです。 全てのアイコンです。 ソーシャルアイコンも揃っています。 例です。ドロップダウンやボタンにつけています。 大きさが自由に変更できるのもフォントならではです。 ドロップダウンにつけると機能がより分かりやすくなります。 カスタマイズすればレーティングに使ったりもできます。 ファイル構成です。SVGやフォントが提供されます。 Font AwesomeはTwitter Bootstrapで提供されているものに加えて色々な場面で役立
Twitter BootstrapでさくさくWeb開発 : アシアルブログ
<div class="container-fluid"> <div class="row-fluid"> <div class="span4"> Span4の中身 </div> <div class="span8"> Span8の中身 </div> </div> </div> Preタグで囲むコード エンジニアの皆さんなら、ブログにコードを書きたいですよね。 Twitter Bootstrapでも、かっこ良くコードを見せる手法を提供しています。 ・codeタグで囲む 赤くなります。 ・preタグで囲む 囲み枠がつき、灰色になります。 ・Preタグ+Google Prettifyを使う preタグのclassに、prettyprint linenums を入れましょう。 これが超かっこいい！！コードを見せるならこれがよさそうですね！ さて、かっこいいGoogle Prettifyですが、こ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
成長を続けるTwitter Bootstrapのエコシステム
Font Awesome – 商用無料のアイコン用のWebフォント – creamu
Icons | Font Awesome