ここでは、テキストボックスの背景色を退避して元に戻すサンプルコードを掲載しています。ここでは、beforeBackgroundColorプロパティという正にそのものなプロパティを使用しています。
Continue readingTag Archives: html
[HTML] テーブルの1つのセル内の左右にテキストを配置する
テーブルのセルのテキストは、tr、td、thタグに、align属性や valign属性を指定することで右詰めや中央に配置することができますが、セル全体に影響を与えてしまいます。
Continue reading[jQuery] select要素の先頭項目を選択する(selectedIndex)
ここでは、jQueyでselect要素の先頭項目を選択するサンプルを掲載しています。いつまでたっても覚えられない今日この頃です。
Continue reading[ HTML ] 振り仮名(ルビ)をふる(rubyタグ)
HTMLでは、 ruby タグを使用して振り仮名をふることができます。漢字やアルファベットの後に括弧などで振り仮名を書いておけば、ほとんどのケースで事足りると思いますが、どうしても必要という場合に使用することになるでしょう。
こういう感じで、ほとんどの場合はOKかと。。PPAP(ペンパイナッポーアッポーペン)
[ HTML ] テーブルのタイトルを表示する ( caption 要素 )
ここでは、HTML の table 要素で作成された表の上下にテーブルのタイトルを表示するサンプルを掲載しています。
[ HTML CSS ] 英小文字をサイズの小さな英大文字に変換する ( スモールキャピタル )
英文字をスモールキャピタルにするには font-variant に small-capsを指定します。言葉だけでは説明しにくいのですが、スモールキャピタルとは、”abc” といった英小文字を小さな英大文字 “abc” に変換して出力することをいいます。
ここでは、スモールキャピタルがどのような文字に影響するかサンプルを掲載して確認しています。
[ HTML ] 文字を全て大文字(小文字)に変換する ( text-transform )
HTML のスタイルに text-transform を設定することで、表示する文字列を全て大文字に、または小文字に変換することができます。ここでは、実際にブラウザで出力させて確認しています。
[ HTML ] visibility: hidden と display: none の違いは?
ここでは、HTML で要素を非表示にする visibility: hidden と display: none の違いを実際に表示させることで確認しています。必要に応じて使い分けることで期待する表示を得ることができるようになることでしょう。
[ HTML ] テーブルの横幅以上の画像を切り詰めて表示する ( IE 限定 )
IE では、テーブルの横幅以上のサイズを持つ画像をセルに挿入した場合に、画像をテーブルの横幅に切り詰められてブラウザに出力することができます。なお、Chrome や FireFox では、そのような出力にはなりません。
[ HTML5 ] Font 要素は廃止されました ( 廃止された要素一覧 )
今でも Font タグで設定した装飾はブラウザで表示してくれていますが、あるときを境に急に Font での装飾が一斉に表示されなくなる日が来るかもしれません。
今後もサイトやブログを長期的に運用していくのであれば、少なくとも HTML5 で廃止された要素の使用をやめたほうが良いでしょう。