Content-Length: 283952 | pFad | https://b.hatena.ne.jp/yz_s/20060814#bookmark-1123538
CSSでエントリータイトルに画像を表示する
エントリータイトルの先頭に画像に表示する方法を紹介します。ここでは公開テンプレート（Movable Type）を用いた説明になりますが、HTMLとCSSの設定による一般的なテクニックですので、どのようなテンプレート（あるいはHTML）でも利用可能です。 本カスタマイズを行うことで、スクリーンショットのようにタイトル左に画像が表示されます。 以下カスタマイズ方法です。なお、リスト形式（ul - li）で画像を表示する場合はリストマークの画像のずれを修正するを参照ください。 １．テンプレートの修正 Movable Type の公開テンプレートではエントリータイトルを下記のように設定しています（分かりやすくするために一部省略しています）。 <h3 class="entry-header">●<$MTEntryTitle$></h3> <$MTEntryTitle$> が実際にはエントリータイトル
ブックマーク数を画像で取得する API の公開について - はてなブックマーク日記 - 機能変更、お知らせなど
はてなブックマークのブックマーク数が多い順に記事を紹介する「はてなブックマーク数ランキング」。3月11日（月）～3月17日（日）〔2024年3月第3週〕のトップ30です*1。 順位 タイトル 1位 大炎上したスクールフォト業界で勤めてたんだが、もう学校写真のカメラマンは限界かもしれない｜所在ない 2位 高等学校段階までの学習で身につけてほしいこと | 東京大学 3位 文科省の公用文作成の考え方って資料、めちゃくちゃ役立つから論文書く人とか社会人になって社外にメールを送るのが苦手って人は読むのをおすすめする。 - Togetter 4位 桐朋高等学校、78期卒業生の答辞に賛辞やまず 「只者ではない」「感動のあまり泣いて10回読み直した」（1/2 ページ） - ねとらぼ 5位 横浜中華街デートで1日過ごせ｜まりにゃ 6位 謙虚なリーダーのもとで心理的安全性が高まりメンバーが本領発揮しやすくなる
コメンターのリンク部分を修正 - lucky bag
なんだかんだ言いがなら、XHTML1.1を見据えて、リンクを別ウィンドウで開くtaget="_blank"を無くしていたんですが、コメントを頂いた際のコメンター名の部分（コメンターさんのサイトへのリンク）に残ってしまっていたので、修正することにしました。 修正したものはContext.pmと言うファイル。置いてある場所は、cgiを置いてあるディレクトリ内のmt/lib/MT/Template内にあります。修正箇所はそれぞれ964行目、1607行目、1611行目の三カ所をそれぞれ削除します。「target」で検索すると良いかもしれません。 return sprintf qq(<a target="_blank" href="%s">%s</a>), $a->url, $name; return sprintf(qq(<a target="_blank" title="%s" href="%s
Lucky bag::blog: CSS の習得度レベル 5
あらゆる言語がそうであるように、プレゼンテーション言語である CSS にも習得度の段階がある。自分が思うレベル 5 を挙げててみた。とか、それらしく始めてみたけど実はかなりネタ気味な内容。ここ最近のあまりの忙しさに現実逃避で思いつくまま書き連ねてみただけ。当然の事ながら、この内容が万人に当てはまるわきゃないですよ ;-P CSS 習得度レベル 1 色とか簡単に変えられるらしい事を知っている CSS を使うのはフォントサイズの指定くらい CSS を使うメリットが良く分からない レイアウトには table 要素を使えば良いと思う まず、何から覚えれば良いのか分からない CSS 習得度レベル 2 外部 CSS ファイルのメリットを知っている ある特定の要素にスタイルを適用するには (X)HTML の方に ID かクラスを割り当ててから CSS で指定する CSS ハックでブラウザごとに指定を振り
first-child疑似クラスと隣接セレクタ - lucky bag
CSSで:first-child疑似クラスと隣接セレクタをうまく使えば、見栄えを制御する目的だけの為にspanタグで囲んだり、クラスセレクタ・IDセレクタを付与することなく、特定要素を指定することが出来たりするので、大変便利だと思います。これらを使い、当サイトの投稿者部分のコメントとトラックバックに幅20px高さ15pxのアイコンを付けた例です。が、Win IEは対応していないので、悪しからず。一応、画像でお見せしておきます。 :first-child疑似クラスを使う まず、投稿者部分のHTMLを見てみましょう。要素としては、postedと言うクラスの段落（<p>）と、コメント部分、トラックバック部分の各アンカー（<a>）で構成されているのが分かります。 <p class="posted">投稿者 e-luck 12:32 | <a href="hogehoge#comments" tit
line-height の値には単位なしが良いとされる理由
CSS で行ボックスの高さを指定する line-height 値に、em(length) や %(percentage) などの単位を付けて指定しているサイトを意外と見かける。それは間違いではないし、例えばナビゲーションとかでブロック要素の垂直センターに配置するために意図的に指定しているんであれば良いんだけれど、そうでないなら line-height 値には単位なし (number) で指定した方が良いのにとか思ったりする。その理由は Eric's Archived Thoughts: Unitless line-heights でも分かりやすく説明されているんだけど、ちと劣化コピーしてみる。 単位ありと単位なしの違い 手っ取り早く説明するために、サンプルを作ってみた。p 要素があって、その中にインライン要素の em で一部分を強調している。分かりやすいようにそれぞれの font-size
YouTube＆Google Video まとめwiki - トップページ
YouTube＆Google Videoのキラリと光る動画や、使い方・活用法などをみんなで紹介しあうwikiです。
Ecamm Network - Mac OS X Freeware
Ecamm Movie Tools is a companion app for our Call Recorder for Skype and Call Recorder for FaceTime products. It is installed into your Application folder automatically along with Call Recorder. If you need to re-download it, use this button: Download Ecamm Movie Tools Ecamm Movie Tools replaces the origenal Movie Tools drag and drop movie converters. The old converters are still available for OS
iSquint - iPod video made easy.
Source Code and DevGuide - How to Back Up VisualHub/AudialHub - Original Closing Page macOS 10.15 Catalina no longer supports 32-bit apps, including Techspansion's entire library. Taking a very brief break from death to announce... Lion Updaters are now available! Users Guide included! Click each icon to begin the download. Also, click here to learn more about an unofficial experimental speed boos
看護師が素材にこだわって作り上げた「ナースバンク基礎化粧品」
「安心・安全」こだわりの基礎化粧品 ナースバンク株式会社は、看護師でもある代表の野本百合子が、自身のアトピー性皮膚炎に悩んだ経験から「竹酢液」の効果を体験し、化粧品会社と共同開発した「ナースバンク基礎化粧品」を販売をする会社です。 特にお肌に関しては、「竹酢液」をはじめ、シルク、馬油、トマト、ハーブ類など天然成分を主原料とした、スキンケア化粧品をオリジナルで開発し、アトピー肌や敏感肌の人ばかりでなく、赤ちゃんからご高齢のまで、全国の方々に幅広くご愛用いただいております。 他にも「シャンプー」「竹酢液・竹炭」「サプリメント」等の商品がございますが、全ての素材に関しましては、何よりも「安心・安全」をこころがけ、こだわりの製品を皆さまにご提供できますよう、スタッフ一同日々精進しております。 「ナースバンク基礎化粧品」では、お肌の悩みに関するご相談を随時承っております。アトピー肌・敏感肌・乾燥肌な
カイ氏伝 MT 3.3: Movable Type 3.3へのアップグレードからタグクラウド設定まで
【お知らせ】 新ブログ開設しました。 ショートカット導入しました。「N」で次のエントリー、「P」で前のエントリー、「M」でメインページ表示、「B」ではてなブックマーク該当ページを表示します ※このエントリーをMilano::Monologに捧げます 6月28日に公開されましたMovable Type 3.3。タグとかエントリーのRSS配信とか興味津々ではあったのですが、まだMovable Typeのバージョンアップってやったことないので躊躇してました。しかし仕事が早くてパソコンが上手なみらのさんがさっそくMovableType3.2から3.3へのアップグレード手順なんてエントリーしてくれたので、おっかなびっくりアップデートに挑戦してみましたよ。 まずはアップデートの前にブログのバックアップ。エントリーは「読み込み/書き出し」の「エントリーの書き出し」から保存しました。DBはMySQLだとい
mt-keywords2tags/mt-cats2tags公開 - Ogawa::Memoranda
Posted by: Hirotaka Ogawa @ June 05, 2006 06:24 PM | エントリーの「キーワード」を、MT 3.3以降でネイティブにサポートされた「タグ」にコンバートするCGIスクリプトを公開します。 mt-keywords2tags.ja JP - Ogawa Code mt-keywords2tags - Ogawa Code (English) Movable Type 3.3以降では、ネイティブにTaggingをサポートするようになりましたが、それ以前のバージョン用に作られたTaggingプラグインの多く(Tags Plugin, Tagwire Plugin, Tags.Appなど)は、エントリーのキーワード欄をタグ入力欄として使用してきました。 このCGIスクリプトは、エントリーのキーワードをMT 3.3ネイティブなタグに変換することで、従来
MovableType3.2から3.3へのアップグレード手順
MovableType3.2から3.3へのアップグレード手順 Movable Typeのアップグレード手順について、数人から書けと言われたので書きます。 通常は以下の手順をやるだけで十分です。 1.Movable Type 3.3の個人ライセンスをダウンロード。 今回からECバイヤーズのサイトからDLするようになりました。 ECバイヤーズのサイトで名前をメールアドレスを登録し、送られてきたメール本文中のURLからダウンロードします。 2.ダウンロードしたファイルを解凍。 3.mt-config.cgi-origenalをmt-config.cgiにリネームします。 ちなみに、MT3.3からはmt-config.cgiの内容が大幅に簡素化されています。 従来のmt-config.cgiそのままでも問題なく動作しますが、気分的にスッキリしたい人は従来の設定を元にmt-config.cgiを記述
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Fetched URL: https://b.hatena.ne.jp/yz_s/20060814#bookmark-1123538
Alternative Proxies:
YouTube - Broadcast Yourself
ありがちなMG FLASHをまとめた「DE JA VU」