ホームページ作成 人気記事ランキング(2ページ目)

Web上の入力フォームで日本語入力機能(IME)のON・OFF・無効状態を制御する方法に、CSSのime-modeプロパティがあります。対応ブラウザはIEやFirefoxで、Edgeでは効かなくなりました。ime-modeの書き方と、ime-modeを使わずに済ませる代替方法として、ChromeやiOS版Safariなどで使えるHTML5.1のinputmode属性や、半角全角を自動変換する方法などをご紹介。

環境依存文字(機種依存文字)でも文字化けせずに表示する方法を紹介。丸囲み数字、ローマ数字、ハートマークなど一部の特殊な文字や記号は、環境依存文字と呼ばれます。HTMLファイルの保存時に文字コード(テキストエンコーディング)をUTF-8にできない場合でも、数値文字参照という特殊な書き方を使えば、閲覧者の環境に関係なく各種記号を文字化けせずに表示できます。

画像のクリック後にページを移動せず、その場で拡大画像を表示できるLightbox系スクリプトのおすすめ4本を紹介。JavaScriptを読み込むタグと短いHTMLを書くだけで簡単に使えます。jQueryを使う定番のLightbox2や、動画のポップアップも可能なColorbox、スマホ対応で全画面表示もできるIntense Imagesなどを紹介。CSSを使えば画像サイズの調整も簡単です。

画面サイズ別にCSSをメディアクエリで切り替える方法を解説。メディアクエリとは、画面サイズなどの閲覧環境に応じて適用スタイルを切り替えるCSSの機能です。レスポンシブWebデザインを作る際にも使い、HTMLのmedia属性値やCSSの@media規則で条件を指定します。スマホ専用スタイルや、PC等の広い画面幅向けスタイルなどを作成しておき、簡単に切り替えられます。

ブラウザ上で右クリックした際に表示されるメニュー(コンテキストメニュー)の表示を禁止したり、コピー操作を無効化したり、その際に警告を表示したりする方法はとても簡単です。しかし、その禁止や無効化を解除(回避)する方法もとても簡単です。右クリックやコピーを禁止するHTML＋JavaScriptの書き方と、その解除方法の両方を解説。

メールアドレスやURLの例を書きたいとき、誰かに所有されているドメイン名を使ってサンプル文字列を作ると問題があります。URLやメールアドレスなどの例示に使えるドメイン名としてexample.comなどいくつかのドメイン名が用意されていますので、それらを使ってサンプルを書きましょう。危険なサイトに繋がる可能性もある紛らわしいドメイン名にも注意して下さい。

tableの幅を均等に指定する方法を解説。HTMLのtable要素で作成した表の列幅は、CSSのtable-layoutプロパティで均等に指定できます。ウインドウいっぱいに均等配分することも、一部の幅を固定した上で残りを可変長にして均等配分することも可能。標準では各セル内の文字に合わせるように自動でサイズが決まるため、列幅はバラバラになりがちです。

JavaScriptで入力チェック・文字を入力制限する方法を解説。メールアドレスや日付のように入力文字数や文字種を制限したいフォームでは、リアルタイムにエラー表示できると便利。正規表現などを使う入力チェックの書き方をサンプルと共にご紹介。

HTMLのhref属性の書き方を解説。hrefの読み方や意味などの基礎から、ページ内リンクやメールアドレスへのリンクの作り方、target属性やdownload属性との併記方法など、href属性値の書き方・活用方法をご紹介。

idとclassの違いと、使い分け方法をご紹介いたします。HTMLにスタイルシート(CSS)を適用する方法には、class属性を使う方法と、id属性を使う方法があります。この「class」と「id」は明確に役割が異なります。全部にclass属性を使っている場合は問題ありませんが、全部にid属性を使っている場合は問題がある可能性があります。