Foundation の使い方: Media Queries 編 | WP-E (仮)
Foundation 割と好きめのハマチです。 多機能過ぎて取っ付きにくい印象の Foundation でしたが、その全てを使いきらなくても十分便利でしたので数回に分けてかじっていこうと思います。 Foundation の準備 Foundation があればなんでもいいですが、今回は私がいつも開発用に使っている gulp-web-starter を使ったサンプルで紹介します。このサンプルは Shell Script が動く環境 sass > 3.4 sass-globbing node.js > 0.12.0 npm > 2.7.3 bower > 1.3.12 があれば上手く行くと思います。また、この記事が書かれた時点での Foundation のバージョンは5.5.1です。 Foundation の利用方法はいくつかありますが、この例では Bower を使った方法になります。 まずは
Foundation 5をIE8に対応させるためのTIPS - crosawassant's blog
2015/05/25 追記しました。 CSSフレームワークといえばBootstrapとFoudationが有名ドコロでしょうか。 私はBootstrapしか使ったことがないのですが、Bootstrapのclass指定の冗長さが気になってきまして、今回はFoundationを使って構築してみることにしました。 FoudationはBootstrapよりもクラスがスッキリしているのはいいですが、問題はIE8に対応していないということ…。 IE8のサポートは2016年1月12日まで。無理に対応させなくてもいいじゃないのと思うのですが、まだまだ使っている人が多いのも事実…。そこで無理やりIE8に対応させる方法をメモしておきます。 元ネタはここ↓です。 Foundation 5 and IE8 | Foundation Forum from ZURB IE開発者ツールのエミュレーションだと、この方法
WordPress & Foundation 勉強会＆新年会
オリジナルなテーマを作りたい。WordPress の機能を自在に駆使したい。・・・・ そんな野望を秘めた貴方に朗報であります！ UNDERSCORES （アンダースコアエス）: A Starter Theme for WordPress WordPress のデフォルトテーマなどに使われているスターター・テーマです。 このテーマにFoundationというCSSフレームワークを組み合わせます。 Foundation: Responsive Front-end Framework さらに！Sass 対応機能を使って、Foundation の魅力を引き出します！ 新春、Web クリエイターとしての可能性にチャレンジしてみませんか？ 勉強会の成果、または個別の課題を新年会で発表しましょう。 【要項】 日 時 2015年１月10日（土）１３：３０開始（開場 １３時； 終了 ２０時） 会 場 モバフ
はじめてのオリジナルテーマ制作
2. 自己紹介 • 名前 三柴 誠一郎（フリーランス） • 職業 Webのディレクションとかフロントエンドとか • 経歴 IT業界１７年 ⇒ ニート9ヶ月 ⇒ フリーランスもうすぐ1年 • 最近の気になる事 ベスト３ 猫がついてくる 鞄からおでん（ちくわ）が出てきた 5. スターターテーマ（_s）？ テンプレートファイルがあらかじめ用意されている！ スタイルシート オリジナルテーマを作るために必要な style.css【必須】テーマのスタイルシート rtl.css 右から左に記述する言語用のスタイルシート テーマ関数ファイルfunction.php【必須】WordPressの（管理画面・サイト）を制御します テンプレートファイル index.php【必須】メインテンプレート single.php 投稿ページの個別表示用テンプレート page.php 固定ページの個別表示用テンプレート 他に
【Foundation for Apps & Fluentd】ファンタラクティブ・オープンミーティング #6
ファンタラクティブ・オープンミーティングとは ファンタラクティブ・オープンミーティングは、ファンタラクティブ株式会社の社内勉強会を開放し、より活発な情報交換を行えるようにするために2週間に1度、定期的に行うWeb技術勉強会です。初心者向けではなく、内容の濃い実践的な部分だけを30分のセッションに凝縮します。 取り上げてほしいテーマのご要望や、セッション・ライトニングトークの登壇ご希望も随時受け付けております。 開催概要 日時：2015年1月6日（火） 20:00〜21:00 会場： コワーキングスペース茅場町 Co-Edo（コエド）5F 参加費用：コワーキングスペース利用料 1,000円 ※懇親会は希望者がいれば、茅場町駅近くで開催します。 タイムテーブル 時間 発表者 タイトル
WordPress で Foundation を利用するときの JS と CSS の読み込み方法 - megane9988のブログ
CSS フレームワークの Foundation を利用して、WordPressのテーマを制作する際に関連のJSとCSSを読み込む方法です。ファイルを読み込む際には wp_enqueue_style と wp_enqueue_script を使います。読み込んだままだと app.js において [code lang=text] Uncaught TypeError: undefined is not a function [/code] というエラーが出てしまい正しく動作しないので、カプセル化を行います。 上 : app.jsのカプセル化 下 : JSとCSSを functions.php から読み込み 参考サイト WordPress で CSS、JavaScript ファイルを読み込む正しい方法 | EastCoder wordpressにjQueryのスクリプトを書くとUncaught
Zurb Foundation 4 チートシート
CSSフレームワークとして、個人的にTwitter Bootstrapより断然注目しているZurb製のFoundation 4のまとめです。Bootstrapはウェブアプリ、ウェブサービス向けという感じがしますが、Foundationはウェブサイトに適していると思います。 今回はとりあえず使いはじめるためのガイドとして作成したもので、全ての機能を網羅したものではありません。詳細は公式ドキュメントを確認してください。また、Foundation 4にどんな要素があるのか、実際の表示で確認するには Kitchen Sink ページに全サンプルがあります。 今回記事にしてみて思ったのは、既存サイトであっても、これからFoundation 4を導入することができるように考えられているなということです。SCSSを使うことが前提になりますが。この記事でいくつかは紹介していますが、Mix-inが用意されて
Foundation for Sites 6 Docs
Welcome to Foundation 6 We built Foundation for Sites to be the most advanced responsive front-end framework in the world. Installing FoundationThere are a number of ways to install Foundation for Sites. Our installation page will help you find the best option for you. Install Foundation for Sites New to Foundation for Sites?With an easy to understand syntax and consistent structure, you'll learn
$ foundation new! Foundation 5がリリースされました
モバイルファーストなレスポンシブウェブデザインを実現するフロントエンド・フレームワークのFoundationがメジャーアップデートし、バージョン5がリリースされました！当ブログでも何度かFoundationをご紹介してきましたが、今回はかなり意欲的な内容だと思います。 そもそも、今年Foundation 4がリリースされたばかりでもう変わるのか！とすでにゲンナリしてる方は、そう面倒くさがらないでください。デザイン的にはFoundation 4と変わっていません。Foundation 5はデザインのアップデートではなく、パフォーマンスのアップデート、表示速度の改善が大きなポイントになっていると言うことです。 レスポンシブ配信 表示サイズによって自動的に異なるコンテンツを配信する技術です。このレスポンシブ配信技術により、大きな画面では大きな画像、小さな画面では小さな画像を配信することが可能にな
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CSS Nite LP39 Coder's High 2015 森田さんのセッションでのTweet