HTML5が使えるスマートフォンOS HTML5が使えると言うと少し言いすぎですが、headerなどの新要素に対してdisplay:blockが指定されているOSです。 iPhoneなどではiOS4.0以上から、Androidでは2.2からdisplay:blockが適用されています。 それ以下のバージョンでHTML5を利用したい場合は、 article, aside, figure, footer, header,hgroup, nav, section { display:block; } といったdisplayの指定が必要です。 Safariや最新のiPhoneで検証してたら忘れがちになりそうなのでメモ。 追記：@hilokiから「dialogはもう抜きでよろしいかもです！」と指摘いただいのたで削除しました。そういえばこいつはHTML5から削除されたんですよね。 スポンサードリンク
パソコンとインターネット環境があればできるビジネスノウハウを、みなさんとシェアします。 「ポイントサイト」のようなしょぼい（笑）ものから、アフィリエイト、オークション、などを経て、起業まで。 めざせGoogle！Facebook！Amazon！ 週に1度はエントリーを書きたいと思います。 Twitterもフォローしてね！ お疲れ様です。 今日のエントリは、以前書いた「5分でわかるHTML講座」と「5分でわかるスタイルシート講座」を読み終わっているか、同等の知識をすでに持っていらっしゃる方対象です。 というのは、【zen-codingとは、HTMLやCSSを記述する新しい方法】だからです。 HTMLとCSSを書く機会がなければ、知らなくていいことです。 ただ、HTMLやCSSを書く機会があるならば、知らないと、確実に損しますよ。 zen-codingは、HTMLやCSSを書くスピードを3倍か
CSSハック一覧 - IE, Firefox, Safariなどなど異なるブラウザーで見たらレイアウトが崩れる。。CSSハックはそんな時のお役立ち裏技（？）です。私がブックマークしているCSSハックに関するWebサイトがたくさんあったので（Safariがのってない・IE8しかのってない。。等の理由で）、自分用メモ。「こんなやり方もある！」というのがあればコメントして教えてください！ Internet ExplorerIE6 以下#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#hel
それから、CSSでもテキストエディタを使います。 HTML編でも述べたように、Windowsの「メモ帳」やMacの「テキストエディット」は、HTMLやCSSのような（それからJavaScriptなどのプログラミング言語も）、厳密に規格が定義されたテキストを書くのには向いていません。 Windowsなら「EmEditor」、Macなら「Coda」をインストールしてくださいね。【追記】MacはEspressoの方がいいかも。詳しくはzen-codingの記事を読んでね！ これらのエディタは、再来週に書く予定の「5分でわかるzen-coding講座」に対応しています（zen-codingとは、HTMLやCSSを書くスピードを10倍速くする、魔法の記述法です）。 さて、いつものように前置きが長くなりました。 さっそく1分目、行ってみましょう。 1分目：「ディレクトリ」を知る、作る あなたのパソコン
I don’t use CSS hacks anymore. Instead I use IE’s conditional comments to apply classes to the body tag. Nonetheless, I wanted to document every browser-specific css selector and style attribute hack I’ve seen. Plus there’s no way to provide stylesheets to only Safari, I believe. With these you’ll be able to better target IE, Firefox, Chrome, Safari and Opera from within the css. So here are go: 2
将来、何かの役に立つかもしれないので、メモとしてエントリー。 IEなんかの古いブラウザに対応するための CSS ハック方法は古くから知られていますが、CSS3 への過渡期の現在、（本当は使いたくない）ベンダー・プレフィックスや Modernizr なんかを使って新しいデザインにチャレンジしている人も多いことでしょう。 それでもなお、特定ブラウザの、特定バージョンで思った通りのデザインにならないことがあれば、やはり何かしらのハックに頼らざるを得ない状況は、今も昔も変わらないのかもしれません。 そんな場合のハックを An HTML5 boilerplate addon for CSS browser nitpicks から紹介です。紹介されているテクニックは、従来型の CSS 解釈時バグや CSS 属性のアリ／ナシといった特徴や機能ベースではなく、そのものズバリ、ユーザーエージェントによるブラ
CSS Specific for Internet Explorer デモページ（※IE7で表示） [ad#ad-2] デモ紹介 1. 条件付きコメントの利用 2. CSS Hackの利用 3. 条件付きのHTML class デモ紹介 デモページは、下記のように設定されています。 スタンダードブラウザ（IE9, Firefox, Chrome, Safari, Operaなど） 背景色がグレー IE8 背景色がピンク IE7 or IE8互換モード 背景色がグリーン IE6 背景色がブルー 下記はデモページをIETesterで表示したものです。 IETesterの詳しい説明は、「IE5.5, IE6, IE7, IE8の確認が同時にできる -IETester」を参照ください。 デモページ（※IE8で表示） IE9もWin7+IE9で確認したところ、背景はグレーに表示されていました。 [a
Sass is the most mature, stable, and powerful professional grade CSS extension language in the world. CSS Compatible Sass is completely compatible with all versions of CSS. We take this compatibility seriously, so that you can seamlessly use any available CSS libraries. Feature Rich Sass boasts more features and abilities than any other CSS extension language out there. The Sass Core Team has work
X11の色名称（英: X11 color names）は、X Window System において色を表すのに使われる文字列であり、単純なテキストファイルにその文字列とRGB値の対応の一覧が記述されている。あらゆる X の実装に存在し、通常 <X11root>/lib/X11/rgb.txt にある[1]。 RGB値や色名でソートされているわけでもなく、多くのRGB値は複数の名前が付いている。それにもかかわらず、これが事実上の標準として使われている。 NCSA Mosaic も Netscape Navigator も最初は X アプリケーションであったため、この色名称を用い、それがウェブカラーの基礎となった。 以下の表は、必ずしも任意の X Window System で共通して見つかる色名称というわけではないが、HTML と CSS に準拠したウェブブラウザで一般化している "X11
As of March 28, 2024, all fonts previously sold on Fonts.com are now available for purchase at MyFonts.com and through Monotype’s subscription service, Monotype Fonts, where applicable. Your customer history will be preserved on MyFonts or through a subscription on Monotype Fonts*. Whichever route you choose, both platforms offer flexible licensing options and convenient ways to access and use the
Web Fonts を使えばパソコンにインストールされていないフォントを表示させることができます。見出しなどに特殊なフォントが使ってある際に、わざわざ画像で用意したりする手間を省くことができます。私のサイトでもロゴに使用しています。 実際に試すことで勉強になりますので、一緒に勉強してみましょう。 Web Fonts を導入する HTML ファイルの作成 まず導入するための HTML ファイルを作ります。 <html> <head> <title>Weble</title> <style type="text/css"> .logo { font-size: 72px; } </style> </head> <body> <p class="logo">WEBLE</p> </body> </html> ブラウザで表示すると以下のようになります。 Google Web Fonts を使う G
概要 Zen-Coding とは、CSSセレクタ風の簡単な記述を、複雑なHTMLソースへ素早く変換することを軸にしたコーディング支援ツールです。 例えば、div h1 aが<div><h1><a href=""></a></h1></div>になります。 その Zen-Coding を秀丸エディタでも利用できるようにすることをめざした秀丸マクロです。 本家にある機能のうち、「HTML生成」「生成したHTMLで既存のソースをラッピング」のみを実装しています。 そのほかの機能は別項で紹介するいくつかの秀丸マクロに任せ、連携していただく方針です。 インストール 秀丸エディタ（ver 7.00 以降のみで確認）を入れてください。 マクロフォルダのパスを確認します。秀丸エディタの [その他] - [動作環境] - [パス] - [環境] - [マクロファイル用のフォルダ] で指定されているフォルダで
HTML layout generator - Layzilla.com ブラウザ上で複雑なレイアウトが作れる「Layzilla.com」 空白のキャンバスにボタンをポチポチ押していってドラッグ＆ドロップすることでレイアウトをどんどん組み立てられます。 レイアウトを配置した例。それぞれ、ふちをドラッグすればリサイズ可能 終わったらソースコードをジェネレート 次のようなそこそこ綺麗なHTMLが出力できます。 勿論、CSSも出力できます。 関連エントリ 複雑なCSSレイアウトをウェブ上で簡単に作成できる「The 1Kb CSS Grid」 レイアウト作成に役立つCSSグリッドレイアウトジェネレーター集
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く