タグ

htmlと*Web制作に関するmascottieのブックマーク (6)

  • リストマークの画像のずれを修正する

    サイドバーメニュー等の先頭のマーク(マーカー)表示に画像を使われている方は少なくないと思いますが、img タグをテンプレートに直接記述するのは、ウェブスタンダードでいうところの「構造とデザインの分離」という面よりあまりお勧めできません。またリストの量が増えると img タグの指定も増えることになり(テンプレートでは数ヶ所の指定で済みますが)、ページサイズにも影響します。 ということで、マーク表示にはCSS・リスト形式(li)の画像指定で表示すること好ましいですし、リスト先頭のマークに画像を使われている方も大勢いらっしゃると思いますが、list-style-image プロパティで li { list-style-image: url(hogehoge.gif); } と画像を指定した場合、下のようにマークが微妙にずれて表示されてしまうのが悩ましいところです(サンプル1)。 サンプル1 これ

    リストマークの画像のずれを修正する
  • HTML4 で使える文字実体参照

    HTMLで使える文字実体参照 この一覧について HTML4 で使える文字実体参照の一覧です。これは、HTML4.0仕様書中の "Character entity references in HTML 4.0" を私が勝手にまとめたものです。利用上の注意も参照してください。 文字実体参照一覧表 HTML2.0 以降で使える文字実体参照 以下は、HTML2.0 がサポートしている文字参照です。どのブラウザでもきちんと表示できるはずです。バグさえなければ。 マークアップ記号 数値文字参照 文字実体参照 備考 コード 文字 実体名 文字

  • HTML/CSS/RSS/ATOMの統合バリデータ、W3Cの「Unicorn」サービス

    Webサイトを作る際に気にしたいのがHTMLCSSなどが正しく記述されているかどうかです。いくつかのWebブラウザで表示をチェックするだけでなく、HTMLCSSのタグや用法があっているかもチェックしてこそプロの仕事。 そうしたチェックにはValidator(バリデータ)がよく使われていました。W3Cの「Markup Validation Service」や「Another HTML-lint gateway」などが有名なところです。しかし、多くのバリデータはHTML、あるいはCSSなどに機能が絞られており、Webサイト全体のチェックには複数のバリデータを利用しなければなりませんでした。 W3Cから新しく登場したバリデータの「Unicorn - W3C 統合検証サービス」は、HTML/CSS/RSS/ATOMなどWebサイトの主要なマークアップをまとめてチェックしてくれる便利なサービスで

    HTML/CSS/RSS/ATOMの統合バリデータ、W3Cの「Unicorn」サービス
  • 基本的なフォーム -- ごく簡単なHTMLの説明

    この例をもとに、HTMLのフォームを構成する要素を順番に説明していきます。この例のHTML全体は、章の最後で改めて紹介します。 フォームの基枠組み データを送信するためには「何を」「どこに」「どうやって」送るかを示さなければなりません。フォームはこのための手段を提供します。 HTMLのフォームは、データを入力するための手段(コントロールと呼びます)と、それに関するラベルや説明から構成されるひとまとまりのセクションです。「何を」送信するかを示すためにこのセクションの範囲を明示し、「どこに」「どうやって」送信するかを設定します。この枠組みを提供するのがform要素です。 form要素の構造 form要素タイプは2つの主要な属性を持ちます。ひとつは「どこに」、つまりデータを受け取るプログラムを指定するaction属性、もうひとつが「どうやって」、つまりデータの送信方法を指定するmethod属

  • とほほのWWW入門

    はじめに ご使用上の注意 (1) 主な更新履歴 (25) 管理者へのメール (1) 自己紹介 (1) 基編 用語集 (82) Webページ作成入門 (7) 逆引きリファレンス (32) フォーマット HTML (402) HTML5 (7) XHTML (1) MathML (1) DTD (1) JSON (1) SVG (1) VML (1) GIF (1) CSV (1) セマンティック・ウェブ (1) CSS CSS (ABC順)(719) Bootstrap (61) Less (1) Sass (1) Tailwind CSS (1) CSSフレームワーク (1) リセットCSS (1) プログラミング言語 JavaScript (42) TypeScript (1) Java (26) Perl (6) PHP (14) Ruby (11) Python (14) Go言語

  • フォームタグの正しいマークアップとCSS | Nutspress

    フォームのテンプレートを作成する際に正しいHTMLのマークアップをしましょうってことで、『How to create perfect form mark up and style it with CSS』というのを見つけたので自分用に覚書。 よく忘れられがちなのが、<fieldset>というタグで無料配布されているCGIやサーバー側で提供しているフォーム、Wordpressなんかでももともとのテンプレートの中に<fieldset>タグを見かけることはほとんどなかったりする。なので、そのままカスタマイズして忘れてしまうタグのひとつがこの<fieldset>タグと<lavel>タグ。 <fieldset>の役割としてはフォームの入力項目をグループ化するためのタグで抜けていてもとくに構文のエラーが出るわけでもないので、結構無視されがち。タグの勉強をしだした頃はしっかり<fieldset>を書くよ

  • 1