タグ

htmlに関するecluciferのブックマーク (152)

  • Table Tag Generator

    To increase or decrease the value, you can either enter on the keyboard, click on the spinner, or turn the mouse wheel. You can select the cells by dragging. Please enter the characters. Please enter the name of the class. × It is not possible to merge <td> and <th>. × It is not possible to re-merge the merged cells. Please split them. × Please enter a number. × Please enter a natural number (1,2,

  • 記号/符号の種類・名称・読み方 =区切り符号/区切り記号=【みんなの知識 ちょっと便利帳】

    中点(なかてん)、中黒(なかぐろ)、黒丸、中ぽつ、ぽつ、中ぽち、ぽち、カタカナミドルドット、ミドルドット、なか

  • &nbsp; は半角スペースではないというお話 (フェンリル | デベロッパーズブログ)

    いかがでしょう? WEBブラウザにもよりますが、結構実際の見た目も違うように思います。 で、冒頭の「半角スペースと &nbsp;」の件ですが、ちゃんと意識しておかないと「あれ?」と思うことがあります。 「&nbsp; を半角スペース (0x20) に置き換える」プログラムがあるように、「&nbsp; を半角スペースに置き換えず、nbsp (0xC2A0) に置き換える」プログラムもありますから、WEB ブラウザのように 0xC2A0 を表示できる場合はいいですけど、表示できないプログラムだと困りますよね。 冒頭の画像は、わが愛するテキステエディタ Emacs だとこんな感じになります、というサンプルでした おまけとして、&nbsp; を 0xC2A0 に置き換える例を。雰囲気をお楽しみください。 use HTML::Entities; use Encode; use Data::Dumpe

    &nbsp; は半角スペースではないというお話 (フェンリル | デベロッパーズブログ)
  • Webタイポグラフィまとめ - Archiva

    Make a note of it: Web tech, montaineering, and so on. Note: この記事は、3年以上前に書かれています。Webの進化は速い!情報の正確性は自己責任で判断してください。 フォント指定や行間、約物といった、文字周りのノウハウです。デザインというより技術的なまとめ。SWFObjectとかsIFRといったFlashネタを除けば、Webの文字は全部CSSでできるんだから... コーダこそタイポグラフィを意識すべし。看板みて書体言い当てるとか変態的な域まで達せずとも、原則だけ覚えとけばプロトタイプが様になるんだし。 オールドスタイル数字 アンパサンド(“&”) スモールキャップ ハイフンとダーシ 各種スペース 合字 約物 約物はぶら下げる :beforeと:after 見出しのサイズ 初期フォントサイズ 行間の調整 余白の調節 各国の日付表記

  • ブロック要素とインライン要素の違い (kuruman.org > 駄的HTML改善計画)

    ブロック要素とインライン要素の違いは非常に重要にも関わらず、気にも留めずにHTMLを記述している人が多く見受けられます。 ここできちんと理解してしまいましょう。 基事項 ブロック要素って何だ? ブロック要素とは、 文書の骨組み です。 例えば見出しを表す <h1> や、段落を表す <p> などがブロック要素です。 これらは視覚表現をするUA(例えばMSIEやMozillaなど)で、特にスタイルを指定しない場合、幅を画面いっぱいに取り、前後が改行されます。 簡単に言ってしまうならば、ブロックを作り出します。 これらの中には大抵他のブロック要素や、インライン要素を含む事が出来ます。 ブロック要素の一覧はインライン要素を知ってから説明することにしたいと思います。 インライン要素って何だ? inlineを直訳すると「行内」であるとおり、インライン要素は 行の中の文字に論理的な意味を持たせたりしま

  • [HTML] パンくずリンクについてのまとめと考察

    パンくずリンク|パンくずリスト(breadcrumb navigation)はどうコーディングするのが今風なんだろう。 ふとそんなことを思い立ってしまったので、名を知られたサイトのソースを覗き見して考えることにした。 パンくずリンクのデザインについてまとめられたBreadcrumbs In Web Design: Examples And Best Practicesという記事によれば、 よくあるデザインパターンは次の通りである。 1行テキスト テキストを横並びにしただけの伝統的なパンくず。各ページリンクの間に区切り文字が入る。 ページタイトルを > で繋いだもの ページタイトルを > 以外の文字で繋いだもの シンプルなリンクの羅列 区切り文字を入れずに画像やCSSで階層を表現する。 マルチステップ 開始から完了までの行程を表示する。 サブナビゲーションつき 各ページリンクに属するページを

    [HTML] パンくずリンクについてのまとめと考察
  • 初心者さんのためのWebサイト制作に役立つリンク集

    2017年6月29日 Webサイト制作 「Webサイト勉強するのにおすすめのサイトを教えてください!」との声が多いのですが、日のWeb関連チュートリアルサイトをあまり見たことがなかったので、今までおすすめできませんでした…。ということでちょっとググって初心者さんによさそうなサイトをいくつか紹介します。小難しい単語が並んであるようなサイトは避けているつもりですが、わかりにくかったらすみません。他にもおすすめサイトがあればぜひコメント欄にて教えてください! ↑私が10年以上利用している会計ソフト! Webサイトを作る流れ まずはWebサイトを作る目的を考える 誰のため?何のため?Webサイトを作り始める前に。 サイトマップと呼ばれる構成図を作成 Webサイトの構成図を簡単に作れる便利ツール ワイヤーフレーム(Webサイトのレイアウト)を作成 Webサイトの骨組み: ワイヤーフレームを素早く・

    初心者さんのためのWebサイト制作に役立つリンク集
  • dwa-net.com - dwa net リソースおよび情報

    This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.

    eclucifer
    eclucifer 2010/05/18
    昔好きだった Web tips サイトさん、いつの間に復活なさっていたのかと!! 『情報古い』とあるけど、その古さが当時を思い起こさせて懐かし楽しいなあ。
  • [IE] Internet Explorer 8 ドキュメント互換性モードの指定について

    IE6のドキュメントタイプで表示が変わる互換性モードに頭を抱えたWeb業界の人は多かろうと思いますが、IE8で更に上位版が出たそうです。 でもIE6で悪行を働いた標準・互換モードの変更動作とは違い、IE8で導入されたドキュメント互換性は、 IEがページを表示する際に使用する特定のレンダリングモードの選択を可能にするもので、従来のDOCTYPEの変わりに 新しくMETA要素の X-UA-Compatible により操作が可能に。 簡単にまとめると IE8だと表示が崩れる…IE7なら崩れないのに…orz ▼ METAタグでIE7モードで表示するよう指示 ▼ IE8がその指示に従ってIE7っぽくレンダリング ▼ ウマー(゚д゚) ということらしい。 その場合のMETAタグは次のようになる(Emulate IE7 互換性モードを指定) <meta http-equiv="X-UA-Compatib

    [IE] Internet Explorer 8 ドキュメント互換性モードの指定について
  • 段落と字下げ - カナかな団首領の自転車置き場ダイアリー

    とかなんとか、まあ、真名垣タンの物言いは、なんとなく生意気で、どこか恥ずかしくさせてくれるモノがあって、何か言ってやりたい心境にはなるのね。確かに。でも、それもいいんぢゃないかと、思ったり思わなかったりしちゃうわけぇ。 んでね。 どうでもいいけど、「カナかな団首領の日記」の人は、何故、段落の始めの一マスを空けないんだろう? うわあ、一取られたなぁ。そうですね。それではとりあえず、以下のスタイルをユーザースタイルシートに加えてみましょう。 p { text-indent : 1em ; } どうです、段落の最初が一字下げになりましたか?ユーザスタイルシートが何か分からない人は、W3C信者の首根っこを掴まえて聞いてみてね。 なんてね。 まあ、段落の最初を字下げするっていうのは、紙媒体では、割とポピュラーの書き方だし、小学校の作文の時間にもそうするように言われてたり言われてなかったりするもので

    段落と字下げ - カナかな団首領の自転車置き場ダイアリー
    eclucifer
    eclucifer 2009/03/19
    紙媒体で読むときは気にならない字下げも、Webで読むと一文字目にあてる視点がチラついて何か好きじゃない。
  • [WP]月別アーカイブリストをドロップダウンリンクにする | emuxx blog

    WordPress のサイドバー等で月別アーカイブリストの表示をドロップダウンにするコードをいろいろ書いてみました。 月数が増えてきてサイドバーをすっきりさせたい時はぜひ~ 参考ページ Template Tags/wp get archives « WordPress Codex http://codex.wordpress.org/Template_Tags/wp_get_archives WordPress › Support » Dropdown Archives http://wordpress.org/support/topic/3242 サンプルコード 以下のコードを使用中のテーマファイル※1 を開いて月別アーカイブリストを取得するテンプレートタグ※2 と差し替えればオーケーです。 月名のみでオートリンクする場合 <select name="archive_dropdown"

  • ウェブサイトの制作・検証に役立つブックマークレット集

    レイアウト用のグリッドをオーバーレイで表示します。 URLを変更すれば画像の変更可。 Bookmarklet Layout Grid Overlay MRI

  • リンクしてもらう時のちょっとした気配り - AZ note

    eclucifer
    eclucifer 2009/02/25
    <q>フォームの部品ごと <label>〜</label> で囲むと、テキストリンク用ソースをクリックした時もテキストボックスにフォーカスが移ります。</q>
  • 検索エンジン3社、正しいサイトURLを認識させるcanonical属性を導入(URLの正規化) ::SEM R (#SEMR)

    検索エンジン3社、正しいサイトURLを認識させるcanonical属性を導入(URLの正規化) GoogleYahoo!Microsoft3社が rel="canonical" (正規化、canonicalization )をサポート。クローラが適切な(canonical)サイトを見つける手がかりに。rel="canonical" はページの head の中に記述すること。 公開日時:2009年02月13日 15:37 GoogleYahoo!Microsoftの3社は2009年2月12日、共同で新しいタグ「 rel="canonical"」のサポートを開始した。rel="canonical"(属性)は、検索エンジンに正しいサイトのURLを認識(正規化、canonicalization)させるために使用される。 同じサイト(ドメイン)でも、たとえば www.sem-r.com、se

    検索エンジン3社、正しいサイトURLを認識させるcanonical属性を導入(URLの正規化) ::SEM R (#SEMR)
  • 正しい理解の爲のHTML覺書

    正しい理解の爲のHTML覺書 基礎知識 HTML 4の概説 World Wide Webとは何か? URIの大雜把な説明 部分識別子 相對URI HTMLとは何か? ウェブとHTMLの略歴 ウェブの黎明期における混亂 W3C設立とHTML 3.2勸告 HTML 4について 國際化對應 スタイルシート アクセシビリティ マークアップの基礎 文書構造の木 要素とタグ タグの省略が許される要素型 内容が存在し得ない空要素 タグは「命令」ではありません ソース文書とそのツリーの例 屬性(Attributes) 汎用屬性: id, class, title, lang, dir 文字參照 數値文字參照 文字實體參照 コメント宣言 リファレンス HTML文書の全體構造 文書構造の序論 HTMLヴァージョン情報 文書ルート: html要素 文書のヘッダ head要素 メタデータ: meta要素 文書タイ

  • IE6でabbr要素を使えるようにする - mayokara note

    元ネタはie7-js。JavaScriptを無効にしていると機能しません。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <title>ie6-abbr-fix</title> <!--[if lt IE 7

  • エクセルシートをHTMLテーブルに変換しちゃう君 (ββ)

    STEP1. エクセルとかからCSV (TSV)をコピーしてを貼り付け STEP2. オプションを選択して変換 細かい設定 列目までをTHEADとする。(0でTHEADなし) TBODYの行目までをTHとする。 TBODY THに深度を埋め込んだクラス名を追加する。(1〜) クラス名: " + n" ひとつめのTHに深度クラスを追加しない。(lv1を追加しない) n列ごとにTRにクラス名を追加する。(0〜) クラス名: 列数  : クラス名に列数を追加する。(nrow0, nrow1,,)

  • Note: idとclassについて考える - JamGraffiti

    既に vantguarde さんがid class 考をしてまして、そこでも触れられていて被るところがあるのですが、まぁ、なんというか私の場合はこんな感じで展開してますよ、というものを書いたものです。 class, id の定義 私の場合、class,id の定義はとても大ざっぱです。 class URI 化できない。 id URI 化できる。( 例: http://www.jam-graffiti.com/about/profile.html#author ) まず、この違いが最初に来ます。ここから始まります。 URI 化できるとゆーことはクールなURIは変わらないの法則がついてくる予感がする クールなURIは変わらないというのは有名ですね。これは頭の片隅に置いておきます。 ここら辺で同時に id は名前とか、その辺の考えがちらついてきます。例えば id="heade

  • サイトの本質 - Weblog

    お気に入りのページを登録すればはてなアンテナが代わりに自動巡回。専用ページに更新順に表示します。(はてなアンテナってなに? , サンプル) 人気のアンテナをインポートして自分用にカスタマイズしたり、友達だけで共有するアンテナも思いのまま! 最も簡単な使い方のご説明です。 まずはいちばん簡単な方法で使ってみてください。(はてなアンテナの使い方)

    eclucifer
    eclucifer 2009/01/05
    イラストだけがんばれば良いというものでは必ずしもないなー。 valid でも■リンクでの展示だとストレスで結局最後まで見ないし。 と、本質を見せ方で殺してしまうこともある。 ってこれはマクアプ自体は関係ない話か
  • 我的春秋: パンくずリストのマークアップ

    ちょっと前に パンくずリスト(Topic Path)を作成する際に使えそうなサンプル8種(CSS HappyLife)というエントリーが盛況でしたが、今日はパンくずナビゲーションの論理構造面を補強する意味も込めて、(X)HTML マークアップの例を、サイト構造やサイトの目的に応じて、いくつか挙げてみました。CSS の話まで入れると長くなるので、今回は(も?)(X)HTML マークアップに話を絞ります。CSS については、特にセレクタまわりが結構 変わってしまいますが、ひとまず、HirasaWa さんのエントリーなどを参照してください。(気が向いたら、別エントリーを立てますけど、実際に書くかどうかは未定。) 階層型構造(tree structure) [2006-02-11 追記] 石川一靖さんより、「セマンティクスを重視するならa要素にrel/rev属性を加えてリンクの関係性を明示するのが

    我的春秋: パンくずリストのマークアップ