戯れ言葉

Visual Studio Code (VSCode)へ完全乗り換えと外部CSSのパス

カテゴリ:フリーソフト
タグ:

 ブログの記事をエディターというソフトで
 HTMLやCSSを編集しながら書いているのですが
 いままで使っていた
 Atomエディターで困っていた日本語入力
20170917001.jpg
 今日の今日は台風襲来
 と云う文章では
 二つ目の今日は、京と変換したい。
 ところがAtomでは変換対象を変更する為のカーソル移動が表示されません。
20170917002.jpg
 メモ帳なんかの殆どのソフトでは
 文章の再変換対象の場所へカーソルを移動し
 求める単語へ再変換することが可能です。
20170917003.jpg
 VSCodeでやって見ると
20170917004.jpg
 変換中の文章内でカーソルの移動が表示され
 普通な日本語入力が出来ます。

 以前にVScodeのこのことは知っていたのですが
 次の理由で採用をためらっていました。
20170917005.jpg
 こうやってVSCodeも
 プラグイン(拡張機能)のLive HTML Previewerで、編集画面をリアルタイムで見ることが出来るのですが、外部CSSが反映されなくて使えないなぁと思ってました。
 ブログで設定しているCSSがこの編集画面でも反映されて欲しいのです。
 Atom ではプラグイン(パッケージ)のatom-html-preview で外部CSSが反映されます。
 先日、ドローイング空間   さんのブログにVSCodeの外部CSSに関することが書かれている記事を見つけ、コメントを書き込みました。
 幸い回答をいただいてそのやりとりの中で解決です。
 私のPC内部に置いたCSSを指定するURLを相対指定にすればVSCodeでも反映されました。
 Atomの時に覚えた絶対URL指定が万能と思い込んでいたのが罠でした。
 幸いCSSファイルは編集するHTMLファイルと同じフォルダーにあるのでCSSファイル名だけをURL部分に書き込むだけです。
 Blog Tmp MyCSS.css という名前のCSSファイルなので

<link rel="stylesheet" href="Blog Tmp MyCSS.css">

と書いて反映されました。
 相対URLで同じホルダーにあるファイルは
./Blog Tmp MyCSS.css
 と云う書き方が正式らしいです。
 VSCode のLive HTML Previewerでありがたいのは、HTML側で記事を入力した時に、Preview画面がページトップに移動しないことです。
 Atom のHTML Previewでは、編集画面で入力するとPreview画面は必ずページトップに移動します。

 もうひとつ  Atom では一寸した細工をすると、Shift+Enter キーで<br>タグが入力できます。
 Shift+Enter キーはLINE やSkipe でも使用できる改行だけを入力する操作ですが、VSCodeではこれができません。
 ただ、HTML文書の編集中ではbrと入力してタブキーを押せば<br>タブが入力されるのと、日本語入力モード中は全角のbrで<br>と変換されるよう辞書登録をして、この辺の不便さはなくなりました。
 当分はこの環境でブログを書いていくつもり。
 こんな中、違う場所で忠告があったのですが
 それはファイル名に大文字を禁止。
 もう一つはファイル名にスペースは禁止

 でも、問題は起こってません。
 純粋なプログラミング上では支障があるのでしょうが、私のWin7上では今のところ支障は出ていません。

Comments 0

There are no comments yet.

Leave a reply
コメントをどうぞ

ブログやホームページのURLをどうぞ

パスワードを入力すると投稿後、訂正・削除が出来ます