戯れ言葉

戯れ言葉

img要素を囲うタグとalt属性

img要素を囲うタグと、img要素のalt属性についてなかなか解りやすいサイトを見つけたので、覚え書きを兼ねてここに記しておきます。 私のブログの最近の記事は写真が主体です。なのでHTMLには画像を表示させるimg要素を大量に書いてます。 で、この画像の下には幾分かの空白行が欲しいのですが、空白行を<br>タグで作ってはいけないとかでmarginプロパティで下方に空白行を作っ...

ブログのテンプレートを障った件(Font-sizeとFont-familyのUDフォント)とAkira氏の記事

テンプレート作家で有名なvanillaice (Akira)氏が最近書かれている記事で、非常に重要なことを書かれていて【追記あり】テンプレート過去作一斉修正(予定)と云う記事なんですが、修正の意義と云う章で「大モバイル時代」の現在は『スマホで見やすい・使いやすい』を第一に考えなければいけないと書いておられます。 文字の大きさも重要で10,11pxといった大きさのフォントはもうダメだそうで、最低でも12pxにしろと。...

文末の文節(顔文字とか)の途中で改行されたくない

web記事で文末の文節が途中で改行されるのが嫌な時があります。今時のレスポンシブ対応のデザインを採用していると、スマホやタブレットでは記事の横幅が狭められるので、文末に特に顔文字を入れていると変な場所で改行されてしまう可能性があります。顔文字は単なる文字列(文字の並び)なので。 例えば ・・・・安く購入できていたのにと。(´_`。)グスン なんて文章も ・・・・安く購入できていたのにと。(´...

XHTMLやHTML4など混在するFC2ブログ< />を吐き出すFC2ブログ?!

WEB上の記事、FC2ブログといった記事をHTMLとかで記述するのですが、HTMLの規則に従って正しく記述されているのかという判定をしたい時、HTMLのバリデーター「WHATWG - HTML Conformance Checkers (Nu Html Checker)」というサイトを利用します。(最近はHTMLと云えばHTML5というHTMLの最新バージョンのことを指します。 これはHTML5か参照) でFC2ブログでコメントのある記事をこのチェッカーにかけると、最新のHTML...

VSCodeの拡張機能W3C Validationが最近動きません

私が何時も使用しているMicrosoftのコードエディター、Visual Studio Code(以降 VSCode)の拡張機能(Extention)にW3C Validationと言うのがあって、この拡張機能はHTMLでブログ記事を書いている時にHTMLのタグや属性の記述間違いがあるとリアルタイムで指摘してくれてとても便利なのです。 ところがこれが最近機能していません。以前にも機能しなくなった時があったのですが、その時はVSCodeのW3CValidationが機能しな...

W3Cが折れてWHATWGにHTMLの基準が統一されたらValidatorは?

WEBテク倉庫さんがある日のコメントに 1月29日付けでW3Cが廃止になった  と書かれていまして、ほうそうなのと。 で、色々調べてみました。 W3Cと云うのが一体何者かという事ですが、World Wide Webで使用される各種技術の標準化を推進する為に設立された標準化団体、非営利団体(World Wide Web Consortium )なのだということです。 今までのHTMLの標準の仕様はここの勧告に従って進められてきた...

HTMLとCSSの備忘録 中身の名前とか辞書とか

HTMLという言語(HTML : Hyper Text Markup Language)はプログラミング言語ではなくて、マークアップと云う言語に分類されます。Web上の記事はこの言語で記述されていて、ブログやホームページも同様です。ツイッターとかも。 HTML言語の話をする時にその構造の各部分の名前をどう言うのかを知っておくと紛れがなくて済みます。これはHTMLだけではなくて技術系一般の話で、専門用語を使用する事は重要で、更にその言葉が何...

CSSプロパティ:floatの新しい解除法 display:flow-root

右図の様に、画像の左や右に文字を回り込ませるには、float というCSSのプロパティを使用しますが、このプロパティは float の解除という操作を行わないと、後続の表示がメチャメチャになります。 この floatの解除は、今までWeb上で良く紹介されてきたのはClearFixと云う方法ですが、私はAkira氏が紹介されている overflow: hidden と云う方法を採用してきました。 (画像の横に文章を回り込ませ...

FC2ブログの新機能 複数画像の一括挿入で不具合が 【 解消されました 】

注記:2020/03/18 FC2ユーザーサポートより返信があって下記不具合は解消されました。 FC2総合インフォメーションから 【ブログ】複数の画像を一括で挿入できるようになりました  とのお知らせがあって、その機能が実装されていますが、実は不具合があります。 この機能を使って11枚以上の画像を記事挿入をすると、記事に挿入された画像の順序が狂うことがあります。で、一...

display:inline-blockのテスト記事

いろはにほへとちりぬるを、わかよたれそつねならむ、ういのおくやまけふこえて いろはにほへとちりぬるを、わかよたれそつねならむ、ういのおくやまけふこえて...

VSCodeのW3CValidationが機能しなくなってたのをこうしたという話

この記事はWindows10での事を書いてます。 Visual Studio Code (以下 VSCode )の拡張機能(Extension)で W3CValidation という機能があるのですが、最近のVSCodeでは、VSCodeとJAVA 双方のバージョンアップがあった影響で以前のままの設定では旨く機能しなくなりました。 こんな風な Java runtime could not be located. というエラーが表示されます。 それがやっ...

画像の横に文章を回り込ませる為に私がやってる方法

画像の横に文字を回り込ませる手法で、私がやってる方法を書いてみます。 ただこの方法はレスポンシブ対応のテンプレでないと記事通りの表示にはならないかもしれません。 過去記事で書いた例ですが 1/4W 1% 金属皮膜抵抗 1%抵抗の5本の色帯は分りにくい。 4本帯は右側がいくらか空いているので判別は容易です。 ...