サイトデザインをする上で、デザインがワンパターンになったり、煮詰まったりすると思います。そんな時、Instagram を使わない手はありません世界中のインスピレーション溢れるアート系の発信やデザイン系のイメージがたくさん参照できます本記事ではデザインのヒントになること間違いなしの海外のアートデザイン系の Instagram アカウントをご紹介します。
「2.5dBUTTON」はフラットデザインに似合うボタンが作れるサイトです。マウスを乗せるとポコッと立体的に浮き上がるボタンが作成できます。作ったボタンはHTML、CSSごとダウンロード可能です。 以下に使ってみた様子を載せておきます。まず、2.5dBUTTONへアクセスしましょう。 試しにボタンを作ってみました。このようにスライダーを調整するだけで色や形を決めることができます。マウスを乗せると上記のようにポコッと浮き上がります。 HTMLとCSSも自動的に出力されるので、あとはこれらをコピペすればOK。 こちらが実際に使っているときの様子です。YouTubeのロゴを作ったり汎用性が高いですね。ぜひフラットデザインのボタンを作成したいときにご活用ください。 2.5dBUTTON (カメきち)
編集部注:本稿は初心者向けにプログラミングやWebデザインの講座を開催している TechAcademy(テックアカデミー)による連載企画。「非エンジニアの起業家が知っておくべきプログラミングの知識」というテーマで数回に分けて極めて基礎的なプログラミングの基礎知識をお伝えする。全連載はこちらから 「非エンジニアが知っておくべきプログラミングの知識」というテーマで、10回に分けてお届けする連載企画。第4回目のテーマは「CSS」です。 前回は「HTMLの設計思想と、2014年に最適な学び方」というテーマでお送りしました。今回は「CSS3からSassまで ─ これから学ぶ人のためのCSS全体像」という記事テーマで、考察・ご紹介します。本連載は、インターネット業界で、これまで技術的なバックグラウンドを持たないまま起業した方や、これから独立・起業しようと思い立った方をサポートするための、連載記事です。
1500以上の会社、お店が利用中の月額無料HP制作サービス 「HPの制作を安心して任せられる業者が見つからない><」 そんなふうに頭を悩ますアナタ。 以下の「ウェブさえパック」はもうチェック済みですか? HPを作るのに必要なものがパッケージになってるお得なサービスです。 料金と事例を見てみる これっ! 太っ腹すぎて降参です。 こんなにクオリティの高いHTMLテンプレートを無料で放出するなんて。僕にはできん! と感嘆の声をあげながら、レスポンンシブでスマホ対応可能なシングルページばかりを集めました。 一枚のhtmlファイルをメインに構成されてるので、初心者でもソースを理解しやすく、Web系じゃないフリーランスやクリエイターのヒトもポートフォリオやプロフィールページの作成に活用できると思います。 ランディングページとして新商品やアプリのキャンペーンに利用してもいいかも。 ちなみにHTMLテンプ
2014年8月22日 CSS, jQuery どんなWebサイトでも設置されているフォーム。なんの装飾もなく味気ないフォームより、デザインされたもののほうが連絡してみたくなるはずです!そんなフォームも少し手を加えるだけで素敵なデザインに変身させることができます。今回はCSS3とjQueryを使ってより美しいフォームを作成する方法を紹介します。 ↑私が10年以上利用している会計ソフト! フォームの仕様 今回チャレンジするフォームの主な仕様です! グラデーション・ボックスシャドウを使って立体感を表現 角丸で丸みをつける(モダンブラウザ) 対応ブラウザ: IE7△, IE8△, IE9, Firefox, Chrome, Safari フォーム制作の流れ CSS3ってなんだ?という人もひとつひとつ記述していけば意外と簡単に作れるはずです!リンクをクリックで各項目にジャンプします。 テキストボック
Shepherdの使い方 Step 1: 外部ファイル 当スタイルシートとスクリプトを外部ファイルとして記述します。 <head> ... <link rel="stylesheet" href="shepherd-theme-arrows.css" /> </head> <body> ... <script src="shepherd.min.js"></script> </body> Step 2: HTML HTMLは普通に実装してOKです。 ガイドを表示する要素には、それが指定できるようclassを付与しておきます。 Step 3: JavaScript ガイドを表示するタイミングや内容はスクリプトで記述します。 基本書式は下記のようになり、classesに表示する場所、scrollToで自動スクロールの有無を指定します。 tour = new Shepherd.Tour defa
2013年3月23日 CSS 異なるブラウザーで見たらレイアウトが崩れる。。CSSハックはそんな時のお役立ち裏技(?)です。私がブックマークしているCSSハックに関するWebサイトがたくさんあったので(Safariがのってない・IE8しかのってない。。等の理由で)、自分用メモ。「こんなやり方もある!」というのがあればコメントして教えてください! ↑私が10年以上利用している会計ソフト! Internet Explorer IE6以下 #help_me { _color: blue; } * html #help_me { color: red; } IE7 *:first-child+html #help_me { color: red; } *+html #help_me { color: red; } IE6, IE7 #help_me { /color: blue; } IE8 #h
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く