CSS謝罪文 - jsdo.it - Share JavaScript, HTML5 and CSS
CSSによるインデックスされない謝罪文 CSSに本文が書いてあるので、画面上は表示されているがGoogleでのキーワード検索には引っかからない 「流出」などの嫌な単語は:beforeと:afterに「流」「出」を分けて書くことで、自然言語解析を回避 #s { p:first-child { font-weight: bold; font-size: 120%; } p:not(:first-child) { text-indent: 1em; } p:nth-child(1):before{ content: "お 詫"; } p:nth-child(1):after{ content: " び"; } p:nth-child(2):before{ content: "平素は弊社のサービスをご利用いただき、誠にありがとうございます。"; } p:nth-child(3):before{ c
Webフォントをキレイに見せるテクニックを2つ紹介(Chrome編)
概要 ▶ 様々なフォントがWebで利用できるモリサワのWebフォントサービス《TypeSquare》が話題になっていますね。TypeSquare [タイプスクウェア] 2012年12月末まで無料で利用できるので、Web業界の人や印刷業界の人が試しているようです。 しかし、この Webフォントサービス、試した方からは意外に不評の声もちらほら…。それは本文組にWebフォントを使用して、Windowsのウェブブラ 様々なフォントがWebで利用できるモリサワのWebフォントサービス《TypeSquare》が話題になっていますね。 TypeSquare [タイプスクウェア] 2012年12月末まで無料で利用できるので、Web業界の人や印刷業界の人が試しているようです。 しかし、この Webフォントサービス、試した方からは意外に不評の声もちらほら…。 それは本文組にWebフォントを使用して、Windo
CSSをシンプルに書くことができるLESS使ってみた
Posted: 2011.12.13 / Category: HTML&CSS / Tag: LESS CSSはシンプルなのでとてもわかりやすい言語ではありますが、その分サイトが肥大化していくとメンテナンス性が悪くなりますね。 LESSを使えばプログラム的な書き方ができるので、ムダなく効率的に管理できるみたいです。 ネスト（階層）化できる たとえばこんなCSSがあります。 css div.section { width: 500px; margin: 0 auto; border: solid 1px #999; padding: 1px; } div.section h3 { background: #999; font-size: 131%; padding: 10px; } div.section h3 a { color: #fff; } div.section h3 a:hove
box-shadowとradial-gradientで画像をポラロイド写真風に
CSS3のbox-shadowプロパティではinsetという値を取ることができ、その場合ブロックの内側に影が付く。これをある工夫と共に利用すると写真の端に影がつけられる。更にradial-gradientでセピア色のグラデーションを重ねてやれば、良い具合に古ぼけさせることもできるので、両方の効果を重ねてやればポラロイド写真風に見えないこともない？ Demo: Polaroid effects using inset box-shadow and radial-gradient キモは以下のようにz-indexを使って画像を背面に回してやること。そうすれば親のブロック要素でのbox-shadowやbackground-imageを画像の上に重ねることができる。 .polaroid { float: left; width: 400px; height: 400px; background-i
CSS3とHTML5でどう違う？ WebKit最新開発版で試す「ルビ」 - builder by ZDNet Japan
HTML5のルビとXHTML 1.1のルビ 本連載のテーマであるEPUBは、規格の成立経緯と仕様の両面において、ウェブと切り離しては考えにくい性質を持っています。基本的にはXHTMLとCSSでコンテンツを記述するため、iOSに搭載のEPUBビューワ「iBooks」のように、エンジン部分をウェブブラウザと共有している例も少なくありません。ウェブの仕様およびその実装であるウェブブラウザとEPUBは不可分の関係、ということもできるでしょう。 そしてウェブの仕様は、現在「HTML5」へと歩を進めつつあります。正式な規格化（W3Cによる勧告）は2012年頃と先の話ではありますが、すでに最終草案（ラストコール）への工程表が提出されていますから、仕様としてはほぼ固まっていると見ることができます。その流れを見越し、主要なウェブブラウザがHTML5の実装を開始していることは、ご存じと思います。 振り仮名とし
DTPのスタイル機能と、Web/ePubのCSSの違い（1）｜DTP Transit
同じスタイルシートですが、DTPのスタイル機能とWeb/ePubのCSSは、かなり異なります。Webでは「HTML+CSS（XHTML+CSS）」と記述するように、CSSだけでなく、その前提となるHTML（XHTML）をどう記述するかが肝心です。 見出し、本文、キャプションにかかわらず、すべての段落は、同じ段落です。 これに段落スタイルを作成／適用することで、見かけ上、見出しらしく、本文らしく、キャプションらしく見えます。 それぞれの段落には、段落スタイルを適用する必要があります。 文字レベルで書式を設定するには、文字スタイルを作成／適用します。文字スタイルは、段落スタイルよりも優先されます。 それぞれの段落には、h1（大見出し）、h2（中見出し）、p（単なる段落）のようにタグ付けされています。サイズや金額を示す洋服のタグと同じようなものです。タグが付けられた段落は、h1要素、h2要素、p
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA