 |
|
個人の方はもちろん、商用利用もＯＫ！使い方自由なホームページ素材集
|
 |
イメージライフでは、プロのWEBデザイナーによって作られたホームページ用素材を、完全無料で提供しています。個人の方はもちろん、商用利用も無料でお使いいただけます。
|
|
|
|
|
 |
お気に入りに入れてもらうときのショートカットを変更する
デフォルトでIEのアイコンが表示されるが、かっこいいアイコンを表示させるだけでもだいぶ印象がかわってきます。
<LINK REL="SHORTCUT ICON" HREF="sample.ico">
sample.ico にファイル名またはファイルまでのパスを設定してください。 |
 |
 |
|
|
|
フォームなどで絶対に半角で入れてほしい、という内容があったときに便利なのが、IMEの機能をオフにしてしまえば、半角しか入力できないという小技。
CSSを使ってIMEを制御する設定をご紹介
※ Windows IE のみ制御可能
<input type="text" name="sample" style="ime-mode:disabled">
赤字で記載している style="ime-mode:disabled" を入力フォームの input タグに指定するだけで半角しか入力できなくなります。
たったこれだけのことですが、システムを構築している方なんかでも知らない方も多い入力制御です。
|
|
|
|
|
|
|
|
|
【 概要 】
ブラウザの設定で画像を非表示にしている場合や、読み込みに失敗した時など
画像の代わりにテキストを表示させます
また、マウスカーソルが乗ってもヘルプとしてテキストが表示されます
【 タグ属性 alt 】
<img src="★" alt="☆">
★=表示させる画像ファイル名（ＵＲＬ）
☆=画像の代わりに表示させる文字
|
|
|
|
|
|
【 概要 】
印刷の改ページ箇所を指定する際に使用します。
このプロパティを指定した要素の直前で強制的に改ページさせたり、その位置での改ページを禁止したりします。
【 スタイルシート 】
例) P タグにスタイルシートを設定する
直前で印刷改行
<p style="page-break-before">
直後で印刷改行
<p style="page-break-after">
|
|
|
|
|
|
【 概要 】
ホームページ上で印刷の実行ボタンを表示させる。
レシピサイトなどページを印刷してから使うサイトにはよく使う機能。
・印刷が行いやすくなる
【 HTML & Javascript 】
<input type=button name=print value="このページを印刷する！" onClick="javascript:window.print()"> |
|
|
|
|
|
URLを指定すると、そのサイトのサムネイル画像を自動生成します。
<img src="http://img.simpleapi.net/small/http://www.image-life.com/">
のようにURLを末尾に付けるだけで作成できるので、簡単に各種サイトに組み込めます。
作成者サイト http://img.simpleapi.net/
|
|
|
|
|
|
│ ┃ ┨ ┥ ┤ ┫ ┣ ┠ ┝ ├ ┌ ┏ └ ┗ ┗ ┻ ━ ┛ ┏ ┳ ━ ┓ └ ┴
─┘ ┌ ┬ ─ ┐ ┼ ╋ ┿ ╂ ┐ ┓ ┘ ┛ ─ ━ ┻ ┷ ┸ ┴ ┳ ┯ ┰ ┬
カテゴリー分類などに使える罫線
意外と探そうと思ったときに見つからないので、紹介しておきます。
イメージライフ
┣素材
┣小技テクニック
┗メールマガジン |
|
|
|
|
|
【 概要 】
IE6で機能するイメージツールバーを、metaタグの指定で無効にすることができます。
このタグはheadタグに囲まれた部分へ記述します。
【 メタタグ 】
<meta http-equiv="Imagetoolbar" content="no">
【 使用例 】
<html>
<head>
<meta http-equiv="Imagetoolbar" content="no">
<title>イメージライフ</title>
</head>
<body>
内容
</body>
</html>
|
|
|
|
|
|
【 概要 】
Tableでレイアウトをしている場合、border="0" を各Tableに設定するようになるが、
全てのTableに設定するのは大変 一括でTableのborderを非表示にする方法
・border="0" を Table ごとに記述する手間を解消
・ソースもすっきりする
・設定忘れもなくなる
【 スタイルシート 】
TABLE { BORDER: 0px; } |
|
|
|
|
|
【 概要 】
画像にリンクしたときに表示される枠を一括で非表示にする方法
・border="0" を画像ごとに記述する手間を解消
・ソースもすっきりする
・設定忘れもなくなる
【 スタイルシート 】
IMG { BORDER: 0px; } |
|
|
|
 |
新しいアイコン追加情報や、メルマガ購読者限定アイコン、限定小技などをお届けします。購読はもちろん無料です！ぜひご購読ください。 |
|
|
 |
