プログラミング

[Mac] PC内で検証用ウェブサーバを動かす【php -S】 Mac

[Mac] PC内で検証用ウェブサーバを動かす【php -S】

phina.js のプログラムをローカルで検証するために、ウェブサーバを立ち上げることにしました。ブラウザでHTMLファイルを開いてもサイトと違うただのファイルとして html を開いた場合(たとえば「file:///Users/user/html/index.html」など)、JavaScriptから相対アドレスでほかのローカルファイルを読み込んだりはできません。JavaScriptのセキュリティ上の制限で、ローカルファイルにはアクセスできないからです。そのため、サイトデー...
[phina.js] ゲーム内で表示できるオブジェクトの基本 とりあえずのメモ

[phina.js] ゲーム内で表示できるオブジェクトの基本

前回は phina.js の土台となるシーン構成を概観しました。今回は シーンの要素となる基本的なオブジェクトをざっと見ていきます。参考資料は、「phina.js Tips集 上巻」です。ゲーム内で表示するオブジェクト前回の各サンプルで使われていたオブジェクトは・Label テキストを配置・Sprite 画像を配置・Button テキストと枠を配置でした。シンプルな項目なら、そのまま生成して配置します。 var label = Label('Hello, phina.js!'...
[phina.js] シーン管理の基本 とりあえずのメモ

[phina.js] シーン管理の基本

phina.jsのシーン遷移については、「<シーン編>|phina.js Tips集 下巻」が詳しいです。特徴的な部分をまとめます。phina.jsでは暗黙のうちにデフォルトのシーンが用意されているので、ちょっと戸惑いました。phina.jsの Hello Worldコード久しぶりに phina.js で遊んでみることにしました。JavaScriptだけでブラウザ上でゲームが動くのはやっぱり手軽です。しかし、プログラムの処理の流れをすっかり忘れています。まずは、シーンの概要と...
[WordPress] 文章校正プラグイン Japanese Proofreading Preview を使いたい とりあえずのメモ

[WordPress] 文章校正プラグイン Japanese Proofreading Preview を使いたい

文章校正プラグイン「Japanese Proofreading Preview」を試してみました。(参考)Japanese Proofreading Preview – WordPress plugin | WordPress.orgこのプラグインは、Yahoo!の「校正支援API」をWordPressエディタから呼び出せるようにするものです。設定のため、Yahooの登録でAPIを利用できるようにしました。アプリケーションの管理:Yahoo!デベロッパーネットワークしかし、設...
[PHP] タグ一覧に件数を追加する(Cocoon) とりあえずのメモ

[PHP] タグ一覧に件数を追加する(Cocoon)

ショートコードで表示している、ブログの記事のタグ一覧に、「件数」を追加しました。「タグリンク」をタップしても表示される記事が少ないと、別のタグを探し直さないといけないからです。前回はこちら。「クリック率向上のために!WordPressで「タグ一覧」に「記事数」を追加する方法」のコードを元に、ショートコード用関数にするために echo の部分を return にして、文字列を返すようにします。// the_tags_with_count() の末尾echo $before . ...
[WordPress] 自作プラグインに投稿文字数を計測するスクリプトを追加した【dbDelta】 とりあえずのメモ

[WordPress] 自作プラグインに投稿文字数を計測するスクリプトを追加した【dbDelta】

自作 WordPressプラグインに、一日の投稿文字数をカウントする機能を追加しました。大まかな処理の流れはプラグインの有効化時に投稿文字数カウント用のデータベースを作成するプラグイン表示時に、累計の投稿文字数を追加する(ただし、同じ日付のデータがあれば更新する)管理メニューでデータベース集計を表形式で表示する一日の成果を文字数で把握できると、ちょっとモチベーションアップになるかも?前回はこちら。データベースの作成(dbDelta)一番手間取ったのは、データベースを作成する処...
「Punycode」とは?(国際化ドメイン) わかりやすさ重視

「Punycode」とは?(国際化ドメイン)

Unicodeドメイン名を ASCIIに変換する「Punycode変換」では、先頭に「xn--」という特徴的な文字列が付加され、一見して元の文字列との対応がわかりにくいです。しかし、これは コンピュータが ASCII文字列に Unicode文字を一つずつくっつけて、元の文字列を復元するための「レシピ」になっています。
[CSS] ブログの文字詰めを微調整した【letter-spacing と font-feature-settings】 とりあえずのメモ

[CSS] ブログの文字詰めを微調整した【letter-spacing と font-feature-settings】

ちいラボでは、なるべく「文字が見やすい大きさ」に設定しています。しかし、自分のスマートフォンで閲覧すると、一行の文字数が少ないために、改行が多すぎる気もしています。そこで、文字の大きさをそのままに、「文字詰め」を狭めてみることにしました。letter-spacing全体的な字間をそのまま減らすには、letter-spacing に負の値を設定します(規定は0)。letter-spacing: -0.05em;font-feature-settings に "palt" を設定...
[AMP] 投稿タイトルにバックスラッシュが含まれていたら【無効なエスケープシーケンス】 プログラミング

[AMP] 投稿タイトルにバックスラッシュが含まれていたら【無効なエスケープシーケンス】

Google Search Console で「解析不能な構造化データの問題」というエラーが表示されました。これは 記事タイトルの中に、エスケープ文字であるバックスラッシュ(0x5C「\」)が入っていたからです。別の文字コードのバックスラッシュ(U+FE68:﹨)に変更したらエラーは消えました。Google Search Console での2つのエラーGoogle Search Consoleの通知で、エラーが表示されました。「解析不能な構造化データの問題」と「AMPの問題...
久しぶりにErgoDoxの設定をした(macOS, JIS日本語配列) #PR含む

久しぶりにErgoDoxの設定をした(macOS, JIS日本語配列)

休眠状態だった ErgoDox(分割型キーボード)を、改めて使ってみようと思います。キーキャップやスタンドを揃え、ファームウェアも作り直しました。特に、ファームウェアの作成やインストールは、とても手軽に進化していました。ErgoDoxは必要なの?しばらく(ここ4年ほど)、使っていなかった理由は、ふだん MacBook Air を使うようになったからです。USBポートが合わなくなったことで、そのままになっていました。さらに、MacBookのキーボードが「かな・英数」キー、コント...
[CSS] 幅とパディングの関係【box-sizing】 とりあえずのメモ

[CSS] 幅とパディングの関係【box-sizing】

HTML要素の幅を固定して、パディングを内側に取りたいときには、「box-sizing」プロパティでborder-boxに指定します。固定ヘッダーとサイドバーが重なって幅が取れないウェブページに固定ヘッダーを作ろうと思いました。位置を position: fixで固定します。ところが、画面サイズによって幅の変わる左サイドバーがあったので、幅がうまくいきません。サイドバーの幅の分だけ右にずらす(leftやpadding-left)と、ヘッダーバー全体が画面から右にはみ出てしまい...
手軽にプログラミングするならオンラインIDEが便利(ideone.com) とりあえずのメモ

手軽にプログラミングするならオンラインIDEが便利(ideone.com)

たまに、連番の文字列を入力したいなど、ちょっとした単純作業をプログラムで処理したい場合があります。しかし、その時のパソコンによってプログラミング環境があったり、なかったり。久しぶりに使うと、そのタイミングでアップデートから用意しないといけません。そんなときにすぐに使えるのが、オンラインIDE(統合開発環境)。インターネット上にコードを入力するだけで、かんたんな出力結果を得ることができます。(サイト)for i in range(312, 324): print('<img u...
[Cocoon] ソースコードハイライトが反映されない?【CSSセレクタ】 とりあえずのメモ

[Cocoon] ソースコードハイライトが反映されない?【CSSセレクタ】

なぜか、Cocoonのテーマ設定のソースコードが反映されませんでした。CSSセレクタを設定し直したら、うまく動きました。highlight.jsが動作しないCocoonテーマには、ソースコード ハイライト機能があります。これは、highlight.jsを利用しています。しかし、Cocoon設定では、ちゃんとハイライト表示にチェックがつけたのですが、記事内のソースコードがそのままでした。これまで うまくコードハイライトが表示されない原因は、「スクリプトの遅延処理などのほかのプラ...
[WordPress]記事ごとの平均PVを集計するサブメニューを自作プラグインに追加した とりあえずのメモ

[WordPress]記事ごとの平均PVを集計するサブメニューを自作プラグインに追加した

どんな記事が安定して読まれているのか把握するために、平均PVを調べたいと思いました。前回作った月別ページビュー集計の自作プラグインに追加します。前回はこちら。管理ページにサブメニューを追加する(add_submenu_page)最終的に出来上がったのがこちら。ブログの勢いを将棋の駒でランク付けしています。書いた記事が、駒得で変換されるのでモチベーションが上がります。野球が好きなら、ヒットやホームランでもいいんだろうね。まずは、メニューに項目を追加します。WordPressプラ...
[Word] 過去の均等割付のフィールドコード「eq ﹨o﹨ad」を解除する(重ね文字) Word・Excelなど

[Word] 過去の均等割付のフィールドコード「eq ﹨o﹨ad」を解除する(重ね文字)

Word 98 など Word 2000 以前から使い回された文書を見ていると、不思議な均等割付が紛れ込んでいることがあります。文字列をクリックすると、グレーのまとまりで選択されるのです。これは、重ね文字の「フィールドコード」を利用した擬似的な「均等割付」です。eqは数式のフィールドコード文字列を右クリックすると、「コードの編集」があります。見てみると、フィールドコードになっていました。{eq \o\ad(●●●,□□□□□)}Wordのフィールドコードは、差込印刷などで見か...
【未解決】埋め込んだTwitterのフォントサイズを小さくしたい(けど、いったん断念)[WordPress] SNS

【未解決】埋め込んだTwitterのフォントサイズを小さくしたい(けど、いったん断念)[WordPress]

ただ、ツイートの埋め込みの文字サイズを本文に揃えたいだけなのに、めちゃくちゃ大変……。Twitterのツイートは、「ツイートを埋め込む」からコードを表示して、HTMLに埋め込むことができます。ところが、枠の幅や文字サイズなどは、ウェブサイトと異なるスタイルが適用されます。結論としては、あれこれ調べましたが、諦めました。「埋め込みツイート」が Twitterの仕様変更に依存しているので、サイト側で変更してもすぐに元に戻ってしまうからです。「twitter-tweet」のクラスを...
[WordPress] 脚注のプラグインを入れてCSSを変更した【Easy Footnotes】 とりあえずのメモ

[WordPress] 脚注のプラグインを入れてCSSを変更した【Easy Footnotes】

脚注のプラグインを入れました。定番の「Easy Footnotes」です。脚注のメリットは、根拠を添えておけることだよね。Easy Footnotesのショートコード(efn_note)「Easy Footnotes」は、プラグインの追加で検索するとインストールできます。段落ブロック内にショートコードを挿入すると、脚注になります。[efn_note]ここに文章を入れる[/efn_note]マウスポイントでツールチップが表示されるのと、記事末尾に注記が並びます。スマホだと、脚注...
「オープンソース」とは? プログラミング

「オープンソース」とは?

「オープンソース」とは、プログラムを開発するときに、そのソフトウェアのコード(設計図)を公開することです。つまり、オープンソースになっているプログラムは、誰でも自由に使えるし、自分で改良して使うこともできます。
[Cocoon] ブログカードをラベルボックスのように表示するCSS プログラミング

[Cocoon] ブログカードをラベルボックスのように表示するCSS

カタカナ用語は、はじめて目にする人には意味がわかりにくいものです。記事の中で共通して使われる用語説明を、挿入しやすいように、「ブログカード」を活用することにしました。ブログカードでは、スニペットという概要を表示できます。用語と説明を小さな記事にしておけば、ブログ内に挿入できます。「word-description」というHTMLクラスへのスタイルシートで「ラベルボックス」のように表示させてみます。こちらがスタイルシートです。不要な項目を非表示(display: none;)に...
ChatGPTで擬似コードを計算させたら「空気を読む」だけだった【言語モデルはプログラム処理系ではない】(GPT-3) AIの話題

ChatGPTで擬似コードを計算させたら「空気を読む」だけだった【言語モデルはプログラム処理系ではない】(GPT-3)

ChatGPTに擬似コードを与えると、解釈して実行結果を表示できるようです。しかし、ちょっと試してみると その「ハリボテ感」にも気づかされます。一見、本当っぽい出力なのですが、全く正しくないのです。これは「言語モデル」のもつ、必然の性質です。擬似コードの演算結果に見えるものは、「演算」しているわけではありません。これまでの文書データからの「推測」を言っているだけなのです。けして万能ではないんですよね。用途に応じて使い分けることが大事。環境ChatGPT 3 (2023年3月2...
「プログラミング教育より国語力」説は生成AIの台頭で正しくなった【プロンプト エンジニアリング】 AIの話題

「プログラミング教育より国語力」説は生成AIの台頭で正しくなった【プロンプト エンジニアリング】

対話型AI がプログラムを生成できるようになった現在、「プログラミング教育」をどう考えたらいいのでしょう?1つは、プログラミング知識自体は、自分の思い通りのプログラムを作るためには必要ということです。ただし、「読み書き計算」のような誰でも必要な「基礎的なスキル」にはならず、これまで通り「専門的なスキル」のままになるかもしれません(大工職人のような)。もう1つは、プログラミングの技術よりも、「問いを立てる力」の方が重視されていくように思います。そもそも「問い」に気づかなければ、...
[WordPress] 投稿月でグループ分けした月別PV集計表を見るためのカスタムプラグインを作った【ChatGPTと】 とりあえずのメモ

[WordPress] 投稿月でグループ分けした月別PV集計表を見るためのカスタムプラグインを作った【ChatGPTと】

一ヶ月分のブログ公開がどれぐらいのページビューにつながっているのか、集計する自分用のWordPressプラグインを作成しました。自分にとっては未経験の分野でしたが、対話型AI「ChatGPT」に相談してみると、使える叩き台を用意してくれました。WordPressプラグインづくりははじめてでしたが、かなりの時間短縮。無事に完成しました。アクセス集計プラグイン一ヶ月分のブログ公開が、どれぐらいの成果になっているのか知りたいことがあります。これまでは、Google Analytic...
[Excel] 「=25%%」は計算できる?【パーセント表示と演算子】 Word・Excelなど

[Excel] 「=25%%」は計算できる?【パーセント表示と演算子】

「=25%%」の計算結果は、「0.0025」になります。Excelの数式内の「%」は、左の被演算子を100で割る 単項演算子だからです。ただし、数式でない場合は、「25%%」は文字列になってしまいます。数式「=25%%」Excelの数式「=25%%」の計算結果は、「0.0025」になります。数式内の「25%」は、単位付きの定数ではなく、「25/100」という式を表しています。従って、「25%%」は、まず「25 / 100 = 0.25」を計算し、さらに「0.25 / 100」...
[CSS] ブログの記事一覧をInstagramっぽくしたい(いったん断念) とりあえずのメモ

[CSS] ブログの記事一覧をInstagramっぽくしたい(いったん断念)

ひとこと日記のアイキャッチ画像を、Instagramのように大きく表示できるようにしたいと思いました。カスタムHTMLウィジェットでスタイル設定カスタムHTMLのウィジェットで、styleを追加すると、特定のページにスタイルを追加できました。<style>.entry-card-snippet { display: none;}figure.entry-card-thumb { padding-bottom: 0em;} .entry-card-thumb { width: ...
[Cocoon] 表のスタイルで縦線をなしにした【横線のみのtable】 とりあえずのメモ

[Cocoon] 表のスタイルで縦線をなしにした【横線のみのtable】

最近は、表のデザインで、縦の枠線を付けないことが多いようです。Spotifyの「支払いに問題がある」?【クレジットカード情報の更新】より確かに、スッキリした印象になります。ブログ内の表を CSS を変更してみました。「border-width: 2px 0px;」という箇所が肝。横線(border-top, border-bottom)は 2px縦線(border-left, border-right)は 0px に指定されます。/** 表の枠の色(縦線なし) 2023-03...
[Cocoon] 表のデフォルトの枠線が黒になっている(style.min.css) とりあえずのメモ

[Cocoon] 表のデフォルトの枠線が黒になっている(style.min.css)

公開したブログ内の表の枠の色が、なぜか黒に変わっていました。原因は、「style.min.css」。この中に表(table)の枠線の色のスタイルがあるのですが、これが Cocoonのスタイルと競合しているのです。サイトの表の枠の色がおかしい?表の枠の色が、WordPressの編集画面ではオレンジなのに、公開すると黒になっていました。どうも、デフォルトの色に戻ってしまっているようです。Cocoonの表の枠の色Cocoonでは、テーマで選んだ色(サイトキーカラー)がスタイルでまと...
ウェブサイトの左下に動画広告が出てきたけどクリックして大丈夫?【オーバーレイ広告】 とりあえずのメモ

ウェブサイトの左下に動画広告が出てきたけどクリックして大丈夫?【オーバーレイ広告】

iPhone で情報サイトをみていたら、左下に広告動画(?)が表示されました。動画の停止ボタンをクリックしたのですが、この操作は大丈夫だったでしょうか?クリックしないで広告自体をスルーした方がよかったかと、ちょっと心配になりました。画面上に勝手に広告動画が出てくるので、「サイト乗っ取り」かと心配になりますが、これはただのネット広告。情報サイトと提携しているネット広告代理店による「オーバーレイ広告」が表示されているだけなのです。煩わしい広告ではありますが、通常 クリックしたから...
【人工知能】ChatGPTに質問してみたら、けっこう間違えもあった(アカウント登録の仕方) AIの話題

【人工知能】ChatGPTに質問してみたら、けっこう間違えもあった(アカウント登録の仕方)

話題になっている ChatGPT(chat.openai.com/chat) のアカウントを作成して、試してみました。まるで人間が答えたような回答を、すぐに出すのでびっくりしました。しかし、いろんな回答をよく読んでみると「滋賀を四国地方」と言ってみたり、あからさまな間違いも少なくありません。また、こちらから送った文章に機密事項が含まれている場合でも、ChatGPTはそれを学習して、別の人に回答してしまう可能性があります。いよいよ「検索の次の時代」が見えてきました。ただし、結局...
[Cocoon] 各見出し後に「目次に戻る」リンクを追加した(functions.php) とりあえずのメモ

[Cocoon] 各見出し後に「目次に戻る」リンクを追加した(functions.php)

ブログの中でもっともよくクリックされるのは、「目次」だそうです。各セクションに Cocoonの目次に対応した「戻る」ボタンを設置しました。参考サイトを元に、自分のブログに合うように一部修正しました。確かに、目次からサッと読みたいところを確認できるサイトは、とても便利ですよね。目次に戻るリンクを挿入するコードfunctions.phpに追加します。/** 自動で目次に戻るリンクを挿入 */add_filter('the_content', function($content) ...
Google スプレッドシートでスクリプトを使うには?【はじめてに多いエラー】 とりあえずのメモ

Google スプレッドシートでスクリプトを使うには?【はじめてに多いエラー】

Google SpreadSheetでは、「Google Apps Script(GAS)」というスクリプト言語で、プログラムによる自動処理することができます。スクリプトをはじめて試したときに出やすいエラーをまとめておきます。ちょうど、Excel の VBA みたいな感じですね。スプレッドシートの拡張機能まず、Googleにログインして、スプレッドシートを開きます。メニューにある「拡張機能」から「Apps Script」を選択します。スクリプトを入力するすると、スクリプトを記...
[Cocoon] 記事の関連タグをサイドバーに表示した・その2(ショートコードにできた) とりあえずのメモ

[Cocoon] 記事の関連タグをサイドバーに表示した・その2(ショートコードにできた)

結論としては、the_tag_links() ではなく、get_the_tag_links()を呼べばよかっただけでした。以前の方法の問題点以前、記事の関連タグをサイドバーに表示するときに、ショートコードにできず、テキストウィジェットでPHPコードを実行する、という方法でむりやり解決していました。ただし、この方法はウィジェットを確認するたびに、ビジュアル表示になって「コードが評価」されててまうため、作り直しが必要でした。ウィジェットを確認するだけで壊れてしまうのです……その後...
Cocoonで作った注目記事ランキングのショートコードを修正した とりあえずのメモ

Cocoonで作った注目記事ランキングのショートコードを修正した

Cocoonテーマのコードを利用して、自前の「注目記事ランキング」を作っていたのですが、更新によってエラーになってしまいました。改めて、コードを修正して直すことができました。サイトのPHPにエラーがある教室ホームページを見たら、ページにエラーが表示されて、レイアウトが崩れていることに気づきました。(2022年10月17日)。このサイトで重大なエラーが発生しました。WordPressのトラブルシューティングについては、こちらをご覧ください。このエラーは、WordPressサイト...
mvで移動できなかったのでよく見たら…【ファイル名先頭の-】 Mac

mvで移動できなかったのでよく見たら…【ファイル名先頭の-】

mvコマンドでファイルをまとめて移動しようとしたら、うまくいきませんでした。ファイル名の先頭が「-」のファイルが混じっていて、エラーになっていました。
Excelでセルを数えるカウント関数のポイント Word・Excelなど

Excelでセルを数えるカウント関数のポイント

Excelでは、セルを数える関数がいくつか用意されています。基本となるのは、COUNT関数です。ただ、注意点として 文字列は含まれないことを知っておく必要があります。COUNT関数が数えるのは、数値データだけです。「カウントしているのに「0」になる」というときは、文字列を数えようとしていることが多いです。文字列を含めたい場合は、COUNTA関数を使います。また、「○」など、入力値を指定して数えたい場合は、COUNTIF関数を使います。COUNTIF関数は、文字列を引用符(")...
[Cocoon]Amazonリンクの表示スタイルを少しスッキリさせた【display:flex】 とりあえずのメモ

[Cocoon]Amazonリンクの表示スタイルを少しスッキリさせた【display:flex】

スマホでブログを表示したときに、Amazonリンクの下にあるショップへのリンクボタンがちょっと大きすぎる気がしました。CSSで少し微調整していきます。リンクボタンを一列にまとめるまずは、縦に並んで画面を占有しているボタンを、一列にまとめます。flex-wrapをnowrapにして、一列にしwidthをautoにして、左揃えにしました。/** amazonリンクのモバイル表示を整理 */@media screen and (max-width: 834px) { .bookli...
[mac] ゴミ箱に移動したフォルダ名が重複した場合【Directory not empty】 とりあえずのメモ

[mac] ゴミ箱に移動したフォルダ名が重複した場合【Directory not empty】

mvコマンドではゴミ箱(.Trash)に同名フォルダがあると移動できませんでした。シェルスクリプトで、同名フォルダの存在を確認して、タイムスタンプを付加するようにしました。mvコマンドでは同名フォルダがあると移動できないシェルスクリプトで、コピー済みのフォルダをゴミ箱に移動していたら、うまく移動できていないことに気づきました。Directory not emptyこのエラーは、mvコマンドでフォルダ(ディレクトリ)を移動する際に、移動先にも同じフォルダが存在する場合に表示され...
[CSS] 記事一覧画面をスッキリさせた とりあえずのメモ

[CSS] 記事一覧画面をスッキリさせた

記事一覧のページで、記事ごとにオレンジ色の枠で囲んであるのが、ちょっとうるさい気がしたので、CSSを修正しました。/** 記事一覧画面をスッキリさせた*/ .list.ecb-entry-border .entry-card-wrap{ border-color: #e9e9e9; border-width: 0px; border-bottom-width: 1px; margin-bottom:20px; }.entry-card-content { padding-bo...
[note風スタイル] モバイルサイトでのアイキャッチ画像を横一面にした とりあえずのメモ

[note風スタイル] モバイルサイトでのアイキャッチ画像を横一面にした

noteサイトの記事レイアウトを参考に、アイキャッチ画像の余白をなくすことにしました。まず、メイン全体の余白(padding)をなくしてから、記事要素に余白(margin)を追加しました。/** モバイルサイトでアイキャッチの写真を横一面にする*/@media screen and (max-width: 1023px) { main.main { padding-right:0px; padding-left:0px; } .entry-content, .entry-fo...
[mac] コマンドラインからゴミ箱に入れる【~/.Trash】 パソコン基礎知識

[mac] コマンドラインからゴミ箱に入れる【~/.Trash】

mv ~/.TrashMacの「ゴミ箱」フォルダに移動するrmコマンドだと完全に削除されるmacでゴミ箱に移動する処理を自動化したい、と思いました。シェルスクリプトで削除するなら、rm(remove)を使うのですが、▶ 何を削除したか後から確認できない、▶ これは失敗したら元に戻せない、という欠点があります。「ゴミ箱」フォルダは ~/.Trash macの「ゴミ箱」フォルダの場所は、「~/.Trash」です。(~はユーザーディレクトリの場所)先頭がドットなので、隠しフォルダに...
[CSS] Cocoonで印刷時のアイコンリスト・ラベルボックスに枠をつけた プログラミング

[CSS] Cocoonで印刷時のアイコンリスト・ラベルボックスに枠をつけた

ウェブページを印刷する時に、通常は「背景画像を表示しない」になっていて、画面で表示されている背景画像や背景色が印刷されません。これには、インクの使い過ぎを防ぐ効果がありますが、画面表示と見た目が変わってしまいます。特に、このホームページでは、多くのアイコンリスト、ラベルボックスを「枠なし」「薄い背景色」で設定しています。印刷時に、背景色がなくなってしまうと、構造がわかりにくくなってしまうのです。そこで、設定した背景色をもとに、枠(濃いめ)をつけるようにしました。WordPre...