かつてはJavaScriptを利用していたものの、今ではCSSのみで実装できる10の小技
2015年3月18日 CSS 2011年に「少しのコードで実装可能な20のjQuery小技集」という記事で数々の便利な制作技を紹介したのですが、時は流れ、今ではCSSのみで表現できるものが多くなってきました。という事で今回はその記事内で紹介した技を中心に、かつてはJavaScriptを利用していたものの、今ではCSSのみで実装できる小技を紹介します。 ↑私が10年以上利用している会計ソフト！ 目次 Div全体をクリックできるようにする テーブルの偶数・奇数の行の色を変える フォームにテキストを入れておき、フォーカスで消す（文字色も変更） ラジオボタンとチェックボックスを装飾する スライドパネル アコーディオン ツールチップ 言語によってスタイルを変更 横並びのdivの高さ揃える ボックスを上下左右中央に配置する それでは実際にどんな事ができるのか見てみましょう！サンプルも作ったのでコードと
【Bootstrap製】90ページ超えの無料HTML5／CSS3テンプレート素材 Titan
ウェブサイトやアプリ制作に必要なスタイルがあらかじめ定義された、人気CSSフレームワーク Bootstrap。しかし、デザインが他のサイトとかぶってしまうとお悩みの方も多いのではないでしょうか。 今回は、Web制作をより手軽に行うことができる、Bootstrap対応の無料HTML5/CSS3テンプレート素材 Titan をご紹介します。90ページにおよぶ大量のサンプルHTMLページが用意されており、あらゆるプロジェクトに活躍してくれるフリー素材となっています。 Bootstrap を拡張パワーアップ！参考にしたい50個の無料プラグイン、コンポーネントまとめ 無料HTML/CSSテンプレート Titan について Titan はHTML5/CSS3で制作されたBootstrap対応テンプレートで、過去5年間のウェブデザインの傾向を分析して作成されたスタイリッシュな素材です。 じっくりと検討さ
2016年に見直したHTML5・CSS3コーディング手法6選 - ICS MEDIA
HTML・CSSコーディングを取り巻く状況は、数年前と大きく変わっています。最近では、2016年11月にHTML 5.1が勧告されたり、2015年8月頃にChromeのブラウザーシェアがInternet Explorerを抜いたりといったニュースがありました。また、2017年4月にはWindows Vistaのサポートも終了するため、今後対応すべきはWindows 7のIE 11以降となります（※）。当たり前だと思っていたコーディング技術を今一度見直す時期にきているのではないでしょうか。本記事では2016年に見直した、今の時代に即したコーディング技術を紹介します。 ※ 参考記事「Internet Explorerサポートポリシー変更の重要なお知らせ - Microsoft」 1. meta keywords設定は検索順位に関係がない ウェブコンテンツのキーワードを指定するmeta keyw
【CSS】display:inline-block;で要素を横並びにする方法（前半はHTML5におけるボックスの話）
現在、（HTMLにおいては)ブロック要素、インライン要素という分け方がなくなりました。 では、どうなったかというと、その考え方はCSSに引き継がれています。 ブロック要素、インライン要素というHTMLの話ではなくて、 『その要素の、CSSにおける初期設定がブロック扱いなのかインライン扱いなのか』という分け方になっているわけです。 つまり、ブロック要素、インライン要素という分け方は廃止されたものの、ブロック扱い、インライン扱いという見た目の指定に関する考え方は残っているということです。 HTML4.1やXHTML1.0までは、HTMLの『ブロック要素、インライン要素という考え方』とCSSの『displayプロパティ』が混在していたので、HTML5では、それを整理したんですね。 見た目の話に限ると、『ブロック要素、インライン要素』が『コンテンツのカテゴリーやコンテンツモデル』に引き継がれたとい
HTML5要素のカテゴリーを押さえましょう
こんにちは。 WEBマーケティング部の杉尾成行です。 今日は「HTML5要素のカテゴリー」についてお話しさせていただきます。 HTML5のタグの大部分がこれからお話しする7つのカテゴリーに含まれます。 ですが、これらのタグがどこに属しているか全てを把握する必要はありません。 特に、HTMLコーディング初心者の方は以下の話にとらわれることなく、「こういうものがあるんだな」と何となく見ていただくだけで構いません。 実際にコーディングを記述してみて上手くいかない場合、「もしかしたらあの決まりに反しているからかな」と思って、この記事とコンテンツ・モデルに関する記事を再びご覧いただくというくらいの感じでいいと思います。 それを念頭において、下図をご覧ください。 ７つの主要なカテゴリーを表したものです。 重なっている部分があるのは複数のカテゴリーを持つ要素があるということです。 それぞれの要素にはどの
HTML5のコンテンツモデルって何？という方にオススメの記事です。
こんにちは。 本日はコンテンツ・モデルについてお話しさせていただきます。 よろしくお願いします。 コンテンツ・モデルとは HTML5には、それ以前にあったブロック要素、インライン要素を、より細かく定義づけした「コンテンツ・モデル」という概念があります。 コンテンツ・モデルとはどの要素にどの様を入れてよいか定義したものです。 前回紹介したカテゴリーと混同しがちですが、 カテゴリーは、その要素がどこのカテゴリーに属しているか示したもので、 コンテンツ・モデルは、その要素がどのカテゴリーの要素を含んでよいか ということを表したものです。 前回同様、これらを全て把握する必要はありません。（HTMLコーディングを始めて間もない方は特に） 実際にHTMLを記述し始めて思った通りにいかなくて、「この要素の中にあの要素は入れられるか」ということを確認したいとき、このページを再び訪れるという程度で構いません
hanatoweb.jp - このウェブサイトは販売用です！ - hanatoweb リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
Graphical Webの拡がり；HTML5とその周辺技術で実現する | gihyo.jp
もちろん、すべてHTML5を中心とする標準技術であるため、JavaScriptを通じてそれぞれを組み合わせて利用できます。 注目されるGraphicalWeb こうした新しいWebのグラフィックス技術の拡大もあり、2012年にはThe Graphical Webというカンファレンスがスイス開催されました。 The Graphical Web2012のWebサイト 実はこのカンファレンス、2002年から10年以上も続いているカンファレンスで、2011年まではSVG Openという名前で開催されていました（ちなみに、2007年には日本で開催されました）。しかし、2012年からカンファレンス内で扱う技術はSVGのみにとどまらず、HTML5 media、CSS3 Animations、2D Canvas、WebGLなどの技術も取り上げることとなり、こうした技術の総称としてカンファレンスのタイト
Facebookアプリを、HTML5でどうしてサクサクにできたのか。Sencha Touch開発チームが用いた3つのテクニック
Sencha Touchの開発チームがHTML5で高速に動作するFacebookアプリを開発したことを紹介した1つ前の記事 「Facebookのモバイルアプリが失敗した理由はHTML5のせいじゃない。HTML5でサクサク動くFacebookアプリを作って見せたSencha Touch開発チーム」は、非常に多くの読者に注目されました。 この記事で紹介したSencha Touch開発チームのブログ「The Making of Fastbook: An HTML5 Love Story」の後半では、どのようなテクニックを用いて高速なHTML5アプリケーションを実現したのかも紹介されています。 この記事では、その3つのテクニックについてポイントを紹介したいと思います。タイムラインやニュースフィードのようなユーザーインターフェイスを備えたモバイルアプリケーションは、これから広く開発されていくことにな
Learn HTML5, CSS3, Javascript - video style tutorials
Learn HTML5, CSS3, Javascript and more... Video style walkthroughs showing cool stuff being created from scratch
Google がまだ Flash を使っているサービスでみる脱 Flash の難しさ - てっく煮ブログ
Flash, HTML5スマートフォンの普及が進む中、iPhone には Flash が搭載されず、Android 版 Flash は開発停止になるなど、遅かれ早かれ Web 上から Flash が消えていき、リッチな表現は HTML5 に置き換わっていくことは確実となりました。「これからは HTML5 だ」という印象を世間に強く与えたのが、2009 年の Google I/O でした。Google I/O 2009 レポート グーグルが賭けるHTML 5の未来 − ＠ITGoogle はそれ以降、多くのサービスに HTML5 を取り入れてきました。しかし、いまだに Flash を利用しているサービスがいくつかあります。この記事では HTML5 化していない、または、できていない 5 つの Google のサービスを通してどのこで Flash が使われているのかなぜ Flash が使われて
jsdo.it
Come creare il miglior gioco da casinò Quando si progetta un gioco da casinò, la prima cosa che devi considerare è che tipo di gioco sarà. Ci sono molti diversi tipi di giochi da casinò, dalle slot e video poker ai giochi da tavolo e giochi di carte. Dovrai decidere quale tipo di gioco si adatta meglio alle tue esigenze. Ogni tipo di gioco ha il proprio set di regole e regolamenti, quindi dovrai a
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Rubik's Cube
Engadget | Technology News & Reviews
CodePen - Hyperspace
第二回全国統一 HTML5実力テスト - jsdo.it - Share JavaScript, HTML5 and CSS
W3C、ついに HTML5 仕様策定完了 | スラド IT
HTML5KARUTA - 「HTML5カルタ」で覚える！HTML5の108つのタグ
HTML5 & CSS3 Tools and Tutorials
HTML5 Fish Bowl