レスポンシブ対応CSSモジュールフレームワークPure

スポンサードリンク

2013/05/31

レスポンシブ対応CSSモジュールPure

CSSファイルサイズは3.84 KB

スタイルシートを読み込むだけで使えるCSSフレームワーク。
Pure

デザイン全般は薄めの色を基調にした、Bootstrapに近いデザイン。
またフラットデザインに使用される明るい色のボタンが採用されています。

色やスタイルをまとめて変更したい際は
リンク内にあるYUI Skin Builderを利用すると
CSSの知識が浅くても幅広い変化をつけられます。

よくわかるHTML5+CSS3の教科書

10日でおぼえるCSS／CSS3入門教室

スポンサードリンク

-Web制作
-CSS, Web制作, フレームワーク

comment コメントをキャンセル

Web制作

2020/7/12

CSSでレイアウトしたときにリンクの指マークが表示されないときはZ-indexを確認【Web制作】

WEBブラウザはリンク要素の上にマウスカーソルを乗せると矢印から指マークへ切り替わります。 CSSを編集しているときに何度やっても指マークが表示されなくなる不具合が起こることがあります。その時の解決方法を記載します。 CSSでレイアウトしたときにリンクの指マークが表示されない原因はZ-index よくよく考えれば当たり前なのですが、他のことでいっぱいいっぱいになっていると忘れがちな内容です。リンクタグを付けているのに指マークが表示されない要素に『positionのプロパティ』がついているかを確認し ...

Web制作 Wordpress

2014/8/9

Nginx+php-fpmで502 Bad gatewayが出たときの対処メモ

Web制作

2014/7/18

Naverまとめで「サービス利用に制限がかかっているため、ログインできません。」が表示される

JavaScript Web制作

2020/7/12

【JavaScript】Swiperを使って端がちょっと見えるスライダーを実装する方法

数あるJavaScriptスライダープラグインの中で、・bxslider.js ・slick.js の著名ですが今回利用したのが「Swiper」です。 Swiperのメリット Swiperはオプションが多く、いろいろなスライダーを作ることができます。・IE11対応・jQueryが不要・スマホOKでタッチやスワイプにも対応・オプションがありすぎてちょっと面倒とりあえず公式サイトにあるDEMOを見てみると実装できるスライダーの豊富さがわかります。デモを見るだけでも大変です。IE11だと結構動作が ...

mac Web制作アプリデザインレビュー

2014/6/16

アプリデザイナー必須のSlicyでPhotoshopのスライス作業効率が30倍になる！

かったるいPhotoshopのスライスから解消

Web制作

2019/7/30

【WEB制作】Lightboxの実装方法。かっこいい画像ギャラリーがJavaScriptの知識なしで簡単実装できる

LightboxはjQueryを利用したJavaScriptライブラリ。最近は見かける機会が減ってきましたが、写真を押すと写真が拡大表示されて黒背景に写真が等倍で表示される「写真の見栄えをよくできる」ライブラリです。サムネイルを押すと、大きい画像が等倍にリサイズされながらフェード処理されて表示されるので動きがあり非常に見栄えが良いのがポイント高いです。 JavaScriptの専門知識がまったくなくても簡単に導入ができるのでよく利用されています。ライセンスは The MIT Licenseで商用・ ...

Web制作

2020/7/12

古いサイトでたまに見かけるaタグ「javascript:void(0);」の意味【WEB制作】

古いサイトの修正をするときに見かけることがあるのが「javascript:void(0);」 aタグの画面遷移を無効化するために使われていますが、どんなメリット・デメリットがあるのでしょうか。「javascript:void(0);」のメリット・aタグのhrefに書き込むとaタグの画面遷移を無効化・カーソルが「指カーソル」の形になるのでボタンの画像が視覚的に”押すもの”とわかりやすくなる。・表示枠をタブ化するときなどにURL欄に”#”などがつかない「javascript:void(0);」の ...

Web制作 Wordpress

2018/10/25

エックスサーバーからシックスコアサーバーへのWordPress移行手順

Web制作

2013/3/20

【htmlコーディング】Zen Cording for Coda v0.7.1の使い方

Web制作

2012/6/16

短期間でのスマホウェブ開発スライド短期間でのスマホウェブ開発スライド

Web制作 Wordpress

2016/8/2

php-fpm+nginxでload averageが上がった時の対処メモ

JavaScript Web制作

2020/7/12

【Chart.js】グラフを簡単に作れるJavaScriptライブラリ

Chart.jsはグラフをとても簡単に作っていくことができるJavaScriptライブラリです。・どのグラフにするか？・どんな数値・メモリを入れていくか？と中身のデータを入れ替えていくだけでグラフが簡単に出来上がります。エクセルなどのスプレッドシートでグラフを作る感覚に近いです。グラフの初期テンプレートは用意されており色を変えるだけでなく、カスタマイズも出来ます。グラフが表示されるときにアニメーションするのもポイントが高い点です。グラフがアニメーションするとWEBページとしての見栄えも良いで ...

css Web制作

2020/7/12

メディアクエリ(Media Queries)が効かないときに確認したいこと

メディアクエリ(Media Queries)はスマホ向けのWEBサイトを作るのに必須な技術です。メディアクエリを正しく記述しても効かないときがありましたので備忘録として記載しておきます。メディアクエリ @media screen and (max-width: 320px); というように表示させるディスプレイサイズごとに CSSを記述していける書き方です。 CSSは原則として下に書く内容が優先度が高く処理されるため（イレギュラーもあります）メディアクエリを下に追記していくことでディスプレイサイズご ...

Web制作

2014/1/8

Feedlyボタンをブログに設置する方法

Web制作

2019/3/14

「Lity」の使い方。画像や動画を簡単に強制ポップアップ表示させるJSライブラリー【WEB制作】

LityはjQueryを利用したLightbox系のJavaScriptライブラリです。ポイント・画像、インラインコンテンツ、iframe、動画URLをポップアップ表示できる・3kBと超軽量・レスポンシブ対応・利用にはjQuery本体が必要。・MIT license. Lityを使うとどうなる？ユーザーがボタンを押すと、対象の内容をポップアップ表示できます。ポップアップ表示をすることで、自分のサイトから他のサイトへ離脱を減らすことが可能になります。スマホブラウザで開いたときにも別のタブで ...