MdN Design｜総合情報サイト
第16回（最終回） 最新のデザイン表現を適用する ここまで紹介してきたCSSのレイアウトや装飾テクニックは、現在利用者の多いInternet Explorer 7や8、Safari、FirefoxなどのWebブラウザでほぼ問題なく動作するものでした。本連載の最終回は、未来に向けた準備として現在策定中の「CSS 3」の中からモダンブラウザで既に適用可能なスタイルをいくつか紹介します。 （公開日：2010年4月16日 解説：こもりまさあき） 現在策定中のCSS 3について CSSで指定したスタイル指示は、WebブラウザのCSSサポートの度合いによって適用できるかどうかが異なります。例えば、今現在の主流であるブラウザの多くではCSSレベル2（CSS 2）をサポートしているものがほとんどです（特定のプロパティだけ未サポートも含め）。その一方、現在CSSの次のバージョンにあたるCSSレベル3（CSS
Thimble by Mozilla - An online code editor for learners & educators.
Thimble was a code editor for people who love the web. Looking for Thimble projects? Users migrated their projects to the Glitch platform in 2019. If you’re looking for a similar experience, go check them out! Learn more about Thimble and the transition to Glitch below. Mozilla loves the web and people like you who make it. Find out how we can celebrate and protect it together! HistoryThimble was
CSS フォトギャラリー
CSS フォトギャラリー スタイルシートCSS を用いたフォトギャラリーのサンプルをご紹介します。 ※サンプル表示はスマホのように狭い画面では正常に表示されないものもあります。 記録付きフォトギャラリー 画像に日付、タイトル、メモなどのコメントを自由に設定できるシンプルなフォトギャラリーです。アルバムや実験記録、カタログなどに応用できます。 最近のモダンブラウザ（IE10～、Chrome、Firefox、Opera、Safari）ではflex プロパティで、IE9 以前は float プロパティで動作するシンプルなレスポンシブフォトギャラリーと、 テーブルレイアウト display: table プロパティを使用してある程度レスポンシブに対応したサンプルです。（2016年 2月） flex、float 併用による記録付きフォトギャラリー 下図のように、上から「タイトル」、「画像」、「コメン
ASCII.jpリファレンス
サービス終了のお知らせ ASCII.jpリファレンスはサービスを終了しました。2009年のサービス開始以来、長きにわたりご利用いただき、ありがとうございました。 2017年10月5日 株式会社KADOKAWA Web Professional編集部
ASCII.jpリファレンス
サービス終了のお知らせ ASCII.jpリファレンスはサービスを終了しました。2009年のサービス開始以来、長きにわたりご利用いただき、ありがとうございました。 2017年10月5日 株式会社KADOKAWA Web Professional編集部
CSS で作るスマートフォン向け片手操作メニュー
ちょっとしたお遊びなんですが、普段は画面の下の隅に隠れてて、クリック （タップ） で展開、いくつかのショートカットメニューが表示される、しかもスマートフォンだと片手だけで操作しやすいみたいな UI を CSS と超簡単な JavaScript （jQuery 使用） で作ってみたので紹介。 久々にこの手のネタ書いた気がしますけども… ちょっとしたお遊びなんですが、普段は画面の下の隅に隠れてて、クリック （タップ） で展開、いくつかのショートカットメニューが表示される、しかもスマートフォンだと片手だけで操作しやすいみたいな UI を CSS と超簡単な JavaScript （jQuery 使用） で作ってみたので紹介。多分言葉で言っても伝わりにくいと思いますので実際のサンプルをまずは見てみてください。 CSS で作るスマートフォン向け片手操作メニュー サンプル 現在最新版の Firefox
15 Useful Code Snippets for Smartphone Website
2014年8月22日 Webサイト制作, スマートフォン スマートフォンが普及してきて、Webサイトを作る時、スマートフォンサイトも一緒に制作している方も多くなってきていると思います。私もスマホサイトを制作する機会が増え、だんだんEvernoteに保存していたスマートフォンサイトを作る時の小技がたまってきたので、iPhoneで使える小技を中心にまとめて記事にしてみます。いくつかサンプルも作っているので、スマートフォンからあわせてご覧下さい！ ↑私が10年以上利用している会計ソフト！ スマートフォンサイト用小技集 目次 いくつかサンプルも作ったのでスマートフォンから、もしくはブラウザーからユーザーエージェントをiPhoneなどに切り替えてご覧ください！ 横幅をデバイスの幅にあわせる 文字サイズの自動調整をオフ リストのクリック（タップ）範囲を広げる 画面の幅にあわせてCSSを変える リンクテ
はじめてのHTML5 第2回『HTML5のさらに詳しいCSSリセット方法』 | HTML5でサイトをつくろう
リセットCSSとは 各ブラウザ(IE・FireFox・safariなど)は、タグ毎にデフォルトスタイルをそれぞれ独自にもっており、それらをリセットするスタイルシートのことを『リセットCSS』と呼んでいます。 ブラウザ毎のデフォルトスタイルをリセットする理由 例えばデフォルトのまま文字を表示すると、ブラウザ毎に文字サイズが変わってしまいます。そこで、デフォルトのスタイルをすべてリセットするCSSを読み込み解決します。 ※ただし、リセットCSSは必ず必要というわけではありません。今回、詳しい説明などはいたしませんが、ブラウザのデフォルトスタイルを有効に使っていこうという考え方もあります。 HTML5のリセットCSS XHTML1.0でのリセットCSS いままでのXHTML1.0で主に使用しされていた代表的なリセットCSSは、 YUI LibraryのCSS Reset Eric Meyer’s
はじめてのHTML5 第1回『HTML5の基本の書き方を覚える』 | HTML5でサイトをつくろう
第1回テーマ 第1回目のテーマは『HTML5の基本の書き方を覚える』とタイトルに書きましたが、ブログやサイトを作りはじめるには最初に必ず記述する文字がありますよね。 例えば、「DOCTYPE宣言」や「エンコーディング」などです。 HTML5の場合、これらの情報はどうなるのでしょうか？ 今までどうりの記述方法なのか、それとも大幅に変更されているのか。これを知らなければサイトを作りを始めることができないと思い、第1回目のテーマにしました。 では、具体的に今回のテーマ『HTML5の基本の書き方』とは、 HTML5でのDOCTYPE宣言の書き方 html要素と文字のエンコーディング HTML5がIEなど対応していないブラウザへ新要素への対応 HTML5に対応したリセットCSSの導入 です。 上記の条件をクリアして、サイト構築への準備を整えていきたいと思います。 HTML5でのDOCTYPE宣言の書
Adobe、HTML5アニメーションツール「Edge」公開
FlashのようなWebアニメーションをHTML5やJS、CSSなど標準規格を使って制作できる「Edge」のプレビュー版をAdobeが公開。 米Adobe Systemsは8月1日、HTML5に対応したWebモーション／アニメーション制作ツール「Adobe Edge」のパブリックプレビュー版を公開した。FlashのようなアニメーションをHTML、JavaScript、CSSなどの標準規格によってWebサイト上で表示できるようにする。 Dreamweaverなど同社のWeb開発ツールを補完。HTMLにネイティブ対応し、CSSベースのレイアウトデザインを損なうことなくモーションを追加できる。各種描画ツールを使い、CSS3でスタイリングされたHTML要素を生成し、視覚効果の高いコンテンツを制作できるとしている。プレビューはWebKitで行い、コンテンツのデザインや操作を忠実に再現。各種ブラウザや
都道府県選択するやつ。
メモ。 誰かの役にも立つかもしれないしってことで、いつも過去の案件のソースとか探してペタペタしてるけど、何処で使ったのか忘れたりするのでここに貼っておこう。 - コメントにて使用条件を書いてほしいとの事だったので念の為追記しておきます。 特別記載が無いエントリー以外は、どう使うのも自由です。 自分のブログにそのままソース掲載してもらっても、仕事で使ってもいいですし、あらゆる用途に対して自由に使ってください。 もちろん、改変・配布とかも自由です。 ただ、ウチで公開しているソースやサンプルに対して何らかの問題が生じても責任は負いません。各自の責任でご利用ください。 大体こんな感じです。 select要素でマークアップ済みの都道府県のやつ <select name="都道府県"> <option value="">都道府県をお選びください。</option> <optgroup label="北
マークアップエンジニアじゃなくても覚えておきたいHTMLとCSSの話(〜HTML5・CSS3、IE8 それぞれの準備に向けて) - livedoor ディレクター Blog(ブログ)
こんにちは。 livedoor Blogを担当しています石野と申します。 前職はマークアップエンジニア(HTMLコーダー)をしていました。 今回はその経験を踏まえ、ディレクターとして把握しておいた方が良いHTML/CSS関連のお話をご紹介しようと思います。 昨年からHTML5、CSS3、そしてInternet Explorer(以下IE)8のベータ2版発表と、バージョンアップに関するニュースが相次ぎました。 その違いを認識する上でも、また制作サイドのディレクションに活かす上でも本エントリーを参考にしてください。 ▼ 構成 (1) HTML - 文書型について (2) HTML+CSS - クロスブラウザについて (1) 文書型について - ファイルの先頭に陣取っている「DOCTYPE」とは何か？ HTMLソースを開くと、こういった記述を目にしませんか？ !DOCTYPE html PUBL
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CSSでヘッダーを固定にしたサンプル | CSS Lecture
Loading...
Bienvenue sur le blog dédiée aux solutions informatiques