IE8が対応したCSS 2.1の機能：displayプロパティなど3種類を解説 - builder by ZDNet Japan
今回は、IE8が対応した次の3つのプロパティについて確認していきたい。 display list-style-type white-space これらのプロパティには古いIEも対応しているが、CSS 2.1で定義されたすべての値に対応していたわけではなかった。IE8では定義された値を一通りサポートするようになっている。そこで、今回はこれらのプロパティの値のうち、IE8が新しくサポートしたものについて確認していきたい。 なお、新しく対応した機能を利用するにはIE8のStandardsモード（標準準拠モード）で表示する必要がある。Standardsモードや互換表示ボタンについては第2回の記事「IE8のレンダリングモードと互換表示」を参照してほしい。 IE8はdisplayプロパティの値のうち、古いIEで未対応だったrun-inとinline-block、テーブル関連の値に対応した。ここでは、そ
IE8が対応したCSS 2.1の機能：テーブル、セレクタ、アウトライン関連の機能 - builder by ZDNet Japan
前回の「IE8が対応したCSS 2.1の機能：印刷とコンテンツの追加に関する機能に続けて、IE8が新規に対応したCSS 2.1のプロパティや値についてまとめていく。 今回はテーブル、セレクタ、アウトラインに関連する機能を確認していきたい。 なお、新しく対応した機能を利用するにはIE8のStandardsモード（標準準拠モード）で表示する必要がある。Standardsモードや互換表示ボタンについては第2回の記事「IE8のレンダリングモードと互換表示」を参照してほしい。 テーブル関連の機能 IE8は、これまでテーブル関連で未対応だった次の3つのプロパティをサポートした。 border-spacing caption-side empty-cells border-spacingプロパティ border-spacingはセルの間隔を指定するプロパティだ。古いIEではのcellspacing属性を
IE8が対応したCSS 2.1の機能：印刷とコンテンツの追加に関する機能 - builder by ZDNet Japan
IE8はCSS 2.1の機能に一通り対応した。そこで今回からはIE8が新規に対応したCSS 2.1のプロパティや値についてまとめていく。まずは、古いIEでは未対応だった印刷関連の機能と、コンテンツの追加に関する機能について確認していきたい。 なお、新しく対応した機能を利用するにはIE8のStandardsモード（標準準拠モード）で表示する必要がある。Standardsモードや互換表示ボタンについては第2回の記事「IE8のレンダリングモードと互換表示」を参照してほしい。 印刷関連の機能 印刷関連の機能では、古いIEはpage-break-afterとpage-break-beforeプロパティに部分的に対応していた。IE8ではこれらのプロパティを完全にサポートするとともに、@pageルールやpage-break-insideプロパティなど、印刷関連の残りの機能にも対応している。 @pageル
IE8で修正されたCSSとHTMLおよびXHTML関連のバグ - builder by ZDNet Japan
今回はIE8で修正されたCSSのfloat関連以外のバグについてまとめていく。また、HTMLおよびXHTML関連で修正されたバグについても紹介する。 なお、サンプルではIE8の互換表示ボタンを利用して、IE8とIE7のStandardsモード（標準準拠モード）で表示を比較していく。Standardsモードや互換表示ボタンについては第2回の記事「IE8のレンダリングモードと互換表示」を参照してほしい。 1. 横幅の指定でマージンが消える問題 IE8では、横幅の指定で要素の上下マージンが消えるという問題が修正された。たとえば、サンプル01では でマークアップしたテキスト部分の上下にデフォルトスタイルシートで約1.33emのマージンが挿入されるため、IE8のように緑色のテキストと青色の枠線の間に余白が入る。 しかし、古いIEでは横幅を指定するとマージンが消えてしまうという問題が発生していた。サン
IE8で修正されたfloat関連のバグ その2 - builder by ZDNet Japan
前回の「IE8で修正されたfloat関連のバグ その1」に続けて、IE8で修正されたfloat関連のバグを確認していきたい。 なお、サンプルではIE8の互換表示ボタンを利用して、IE7とIE8のStandardsモード（標準準拠モード）で表示を比較していく。Standardsモードや互換表示ボタンについては第2回の記事「IE8のレンダリングモードと互換表示」を参照してほしい。 6. フロート要素の下マージンが消える問題 フロート要素の上下マージンが消える問題は、前回の3.で紹介したが、この問題で消えるのはデフォルトスタイルシートで挿入されるマージンだった。 この他に、古いIEでは特定の条件下でmarginプロパティで指定した下マージンが消えるという問題が発生する。この問題はIE8で修正された。 問題が発生していたのは、フロート要素にmarginまたはmargin-bottomで下マージンを
IE8のレンダリングモードと互換表示 - page3 - builder by ZDNet Japan
Internet Explorer 8（IE8）は標準に準拠した形でページを表示するため、古いバージョンのIEに合わせて作成したページを表示するとレイアウトが崩れてしまう可能性がある。そのため、IE8には3種類のレンダリングモードが用意され、古いIEと同じ形でページを表示できるようになっている。 そこで今回は、各レンダリングモードの特徴や指定方法を確認していく。また、ユーザーがレンダリングモードを切り替えないようにするため、IE8に新しく用意された「互換表示ボタン」を隠す方法を紹介したい。 IE8に用意されたレンダリングモード IE6の時代からIEには下位互換のために複数のレンダリングモードが用意され、必要に応じて古いIEと同じ形でページを表示することができた。たとえば、IE6とIE7には「Standardsモード」（標準準拠モード）と、「Quirksモード」（互換モード）の2種類のレンダ
CSSの現状とIE8 - builder by ZDNet Japan
「IE8のCSS対応」の第1回「IE8が対応したCSSと標準規格（旧題：IE8が対応した標準規格：CSS 2.1は一通りサポート、CSS 3は残念……）」は、builder編集部がつけたタイトルやリード文によってずいぶんとCSS 3がクローズアップされてしまい、本来考えていた原稿とはニュアンスの異なる刺激的な記事になってしまったのには驚いた。 しかし、IE8がCSSに関して非常に重要な鍵をにぎっているブラウザであることは事実。ここでCSSの現状も含めてまとめておきたい。 今回、IE8が一通りサポートしたCSS 2.1は、2007年7月に出された勧告候補が最新版となっている。 勧告候補は最終的な勧告ではなく、ここから勧告案を経て勧告となる。勧告候補は問題があれば草案に差し戻されることもあり、実際にCSS 2.1は一度草案に差し戻され、再び勧告候補としてリリースされた。 勧告がリリースされるま
豊富なUIライブラリが魅力のモックアップアプリ - everything might happen tomorrow - yhassy - builder by ZDNet Japan
ウェブサイトやアプリケーションのモックアップに特化したアプリは幾つかありますが、Windows, Mac, Linux すべてで使えるのを探している方は Mockups がお勧めです。このソフトの最大の特徴はモックアップ用に使える UI が数多く存在し、操作も簡単な点です。インストールした時点で 75 種類の UI 要素が用意されており、ドラッグ＆ドロップで付け足すことが出来ます。検索で欲しい UI を探したり、特定の UI をショートカットを割り当てることも出来るので、素早くモックアップを作り上げることが出来ます。 Mockupsは、BMML (Balsamiq Mockups Markup Language) という独自のXMLフォーマットを利用して UI 要素を共有することが出来ます。Mockups のコミュニティサイト Mockups To Go では、開発者やユーザーが作った U
CSSだけで文字や画像を反転させる - builder by ZDNet Japan
ビジネスの推進には必須！ ZDNet×マイクロソフトが贈る特別企画 今、必要な戦略的セキュリティとガバナンス 50年の経験を持つアイネットが提供 ユーザー企業の使いやすさを第一に考えた ワンストップで使えるマネージドクラウド アプリが簡単にできるって本当？ セールス、マーケ、人事の3名が実際に体験 業務をローコードツールで改善してみた モダンなOSだからこそ可能 MS製品の歴史を振り返りながら ビルトインセキュリティの利点を理解 データドリブンに足りないもの DOMO Japan 川崎氏に聞く データ活用能力の向上に必要なこと 今時プライベートクラウドの作り方 2020年代のプライベートクラウド環境を AzureとVMwareを例に紹介 オープンソース活用はあたりまえ！ そんな今だからこそ改めて考える 企業ITにおけるOSS活用のメリットとリスク ビジネスのためのデータ基盤構築 DX時代の
IE8が対応したCSSと標準規格 - builder by ZDNet Japan
Internet Explorer 8（以下、IE8）の正式版がリリースされた。IE7は標準規格への準拠が不十分で多くのウェブ制作者を失望させたが、IE8ではCSS 2.1をサポートして多くのバグを修正し、FirefoxやSafariなどのブラウザと同じように、標準に準拠したかたちでページを表示できるようになっている。 そこで本連載「IE8のCSS対応」では、IE8が新規に対応したCSSと標準規格について大まかにまとめ、別稿で個別の機能や修正されたバグなどについて細かくみていきたい。 IE8がサポートした標準規格 今回、IE8がサポートした標準規格はW3CのCSS 2.1だ。IE7には未対応のCSS 2.1のプロパティや値があったが、IE8では一通りサポートしている。 IE8が新規にサポートした主なCSS 2.1の機能 機能セレクタやプロパティ
ペルソナ共有用のテンプレート - everything might happen tomorrow - yhassy - builder by ZDNet Japan
連載！プロが語るストレージ戦略 第二回：DX時代のデータ活用とデータ運用 注目される階層型データ基盤のとは何か 未来のセキュリティイノベーターへ 初のオンライン開催となったSecHack365 20年度成果発表 から見えてきた新たな兆し 漫画で解説：IoTはじめの一歩 IoT推進に思わぬ落とし穴？ 設計段階から注意したいポイントと支援 データの散在と非常率運用がネック 企業のDXをITが妨げる喜劇を回避するために キーマンが明かすデータ管理基盤の重要性 いまあるデータで身近な業務をDX 小さくはじめて大きく育てる デザインシンキングからはじめるアプローチ SoRとSoEをつなぐDX推進の要 新しい時代の顧客とのデジタル接点管理 クラウド型商品管理基盤（PIM）の重要性 エンジニアのためのREHL8まとめ 絶えず進化を続けるEnterpriseOSの決定版 見逃し厳禁！知識をアップデイト デ
未来インターフェイス用のPhotoshopブラシ - everything might happen tomorrow - yhassy - builder by ZDNet Japan
ゼロトラストに向けた道のりを支援 自社のセキュリティの課題を浮き彫りにし M365の各機能で対応 特集：IT最適化への道 成功の秘訣をその道のプロが解説 カギとなるのはシステムの「見える化」 企業のリスクマネージメント対策に M365のコンプライアンスソリューションで 内部不正のリスクに備えよう ビッグデータ最前線！ これからのビジネスを左右する データ活用の基礎から応用までを紹介 リモート、オフィス、オンサイト 働く場所を選ばないハイブリッドワーク これからの快適な業務環境構築のポイント 厳しい目が向けられる内部不正 ますます高まるコンプライアンス水準に 企業が追いつく鍵はテクノロジー活用 ネットワークもサービスとして使う いま企業ネットワークが受ける大きな制約 クラウドシフトで大きく変わる！ 漫画で解説：IoTはじめの一歩 IoT推進に思わぬ落とし穴？ 設計段階から注意したいポイントと
CSSでグラデーションを表現する - builder by ZDNet Japan
今時プライベートクラウドの作り方 2020年代のプライベートクラウド環境を AzureとVMwareを例に紹介 オープンソース活用はあたりまえ！ そんな今だからこそ改めて考える 企業ITにおけるOSS活用のメリットとリスク 高い従業員満足度と安心・安全 新時代にむけた理想の業務環境こそ Anywhere Workspaceが目指す未来 ID管理の基礎知識 新しい働き方におけるITガバナンスの 向上にむけて Kubernetes活用の最適解とは？ 今、注目のコンテナを活用した柔軟なIT基盤 運用、管理の課題を解決しメリットを最大化 現場主導のデジタル変革 ビジネス変革のための“ITの民主化” そして 変わるIT部門の役割 本当のデータ活用できていますか？ データドリブンがあたりまえと言われる今あらためて考えたいデータ活用のありかた 膨大なアクセスを支える屋台骨 高い安定性とパフォーマンスを両
Safari 4が対応したCSSの新機能：グラディエント、反転、マスク - builder by ZDNet Japan
Safari 4（ベータ版）では、レンダリングエンジンのWebKitが採用したCSSの新機能「グラディエント」「反転」「マスク」を利用できるようになった。本連載で紹介したトランスフォーム（回転、拡大・縮小、スキュー、移動）の機能と合わせると、これまではグラフィックソフトが必須だった処理の多くをスタイルシートだけで実現できるようになる。 今回は、これらの機能がどのようなものなのかを簡単に紹介したい。 CSSでグラディエント、反転、マスク 次のサンプルは「グラディエント（Gradient）」「反転（Reflect）」「マスク（Mask）」のそれぞれの機能を利用して、Safari 4（ベータ版）で表示したものだ。左から順に、背景をグラデーションカラーで表示したもの、テキストと画像を反転させたもの、画像の輪郭をマスクでぼかしたものとなっている。
CSSでタブ区切りのテキストをきれいに表示する - builder by ZDNet Japan
Kubernetes活用の最適解とは？ 今、注目のコンテナを活用した柔軟なIT基盤 運用、管理の課題を解決しメリットを最大化 Anywhere Workspace！ ハイブリッドワーク時代の働き方 分散業務環境3つの課題と解決策 RPA見直される”業務”と”人”の関係 人的リソースを単純作業から解放！ 高付加価値業務への転換のために 最新ストレージで変わるIT運用 仮想化テクノロジーとFlashArrayの組合せで 運用負荷軽減と高性能化を実現したDMM ランサムウェア対策やリスク管理 マイクロソフトが語るサイバー犯罪の 世界的状況と最新のセキュリティ対策 ビジネスの推進には必須！ ZDNet×マイクロソフトが贈る特別企画 今、必要な戦略的セキュリティとガバナンス 仮想環境データ保護の新次元 高度化・複雑化するIT環境の課題への解決策 最新鋭データ保護・管理ソフトウェア基盤 リモートワーク
CSSでトランスフォーム：1つの要素に複数の変形処理を適用する - builder by ZDNet Japan
前回の「CSSでトランスフォーム：変形処理「transform」の基礎」に続いて、CSSのトランスフォーム（変形処理）の機能について紹介していきたい。 トランスフォームの設定はtransformプロパティで行うが、Safari 3.1以上とGoogle Chromeでは-webkit-transform、Firefox 3.1（ベータ版）では-moz-transformと記述する。現在のところ、それ以外のブラウザではサポートされていない。 複数のトランスフォームを指定する 前回は「回転」「拡大・縮小」「スキュー（シアー）」「移動」のトランスフォームを個別に適用する方法を紹介したが、1つの要素に複数のトランスフォームをまとめて適用することも可能だ。 たとえば、次のようなサンプルを用意して複数のトランスフォームを適用してみよう。ここでは、横幅300ピクセルの黄色いバーの中央に文字を配置して、画
フォトショいらず：CSSで画像の上に斜めの帯と文字を表示してみる - builder by ZDNet Japan
「FirefoxとSafariのCSS徹底検証」では、直近の2回に渡ってCSSのプロパティ「transform」を紹介している。 CSSでトランスフォーム：変形処理「transform」の基礎 CSSでトランスフォーム：1つの要素に複数の変形処理を適用する 今回は番外編として、transformプロパティを使って、画像に対し斜めの帯を付けて表示するテクニックを紹介しよう。 画像にななめの帯を付けて表示する transformプロパティを利用すれば、ヘッダー画像にななめの帯を付けるようなデザインをCSSで実現することができる。 たとえば、次のサンプルでは「Welcome to my Homepage」という文字を表示した黄色い帯を画像の右上に重ね、45度回転して表示している。このとき、黄色い帯の両端を画像に合わせてカットするため、全体を囲んだ
職場での誤解を避けるための10+の方法 - builder by ZDNet Japan
仕事上のコミュニケーションにおいて、誤解というものは往々にして生じ、その結果は軽くても迷惑、下手をすれば悲惨なことにもなりかねない。そこで本記事では、同僚や仕事上の利害関係者とのコミュニケーションの落とし穴を避けるために注意すべき点を（特に海外と取引をする場合に有益な情報も含めて）挙げている。 ビジネスで成功を収めるには、同僚や顧客、サプライヤー、上司、部下との効率的なコミュニケーションが欠かせない。しかし残念なことに、問題が発生する場合も往々にしてあるのだ。そこで本記事では、混乱のきっかけになりやすい落とし穴を11個挙げている。こういったものに注意しておくことで、可能な限り混乱を避けることができるようになるはずである。 ＃1：合意は形成されているのか？ あなたには、恋人だと思っていた人が、あなたのことをさほど真剣に思っていなかったということを知った（あるいはその逆の）経験はないだろうか？
CSSでトランスフォーム：変形処理「transform」の基礎 - builder by ZDNet Japan
ウェブページに表示した文字や画像を回転したり、歪めたりすることができれば便利なのに――そう考えたことはないだろうか。CSSのトランスフォームの機能を利用すれば、「回転」「拡大・縮小」「スキュー（シアー）」「移動」の4種類の変形処理を簡単に適用することができる。 トランスフォームの機能を利用する トランスフォームの機能を利用するには、transformプロパティを利用する。現時点ではSafari 3.1以上とGoogle Chrome、Firefox 3.1（ベータ版）が対応しており、SafariとGoogle Chromeでは-webkit-transform、Firefoxでは-moz-transformと記述する。 たとえば、次のようなサンプルを用意してトランスフォームの処理を適用してみよう。ここでは、横幅300ピクセルの黄色いバーの中央に文字を表示している（サンプル01）。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
グラフィックソフト不要：CSSで画像に透過グラデーションの帯を重ねる - builder by ZDNet Japan
