大西佐七のザ・飛騨弁フォーラム　アクセント

アクセントの表記３

戻る

私:本日からアクセント表記をアクセント辞典最新版(ＮＨＫ、三省堂)と同じく、罫線を用いて行いたい。記念すべき日です。

君:早速に css 技術をマスターしたのね。

私:その通り。まずは実例を。

※パ＼ンダ	※［パ］のあとで下がる。	※頭高型	※パンダ
※ニオ＼イ	※［オ］のあとで下がる。	※中高型	※ニオイ
※ユキ＼	※助詞が付いた場合に、［ユキ＼カ°］のように［キ］のあとで下がる。	※尾高型	※ユキ
※サクラ￣	※下がり目がない（助詞が付いても［ラ］のあとで下がらない）。	※平板型	※サクラ

君:簡単に原理を説明してね。

私:要は、ひらぶん平文、つまりは普通の原稿を書く。さて　HTMLで文字の上線（オーバーライン）を設定するには、CSSの「text-decoration」プロパティを使用します。

君:css の具体的内容は。

私:以下のような内容をテキストファイルで記述し、

@charset "utf-8";

.nuc {
  display: inline-block;
  border-top: solid #222 1px;
  background: url(nuc.png) no-repeat right 0;
  text-indent: 0;
}

任意のディレクトリーに任意の名前で保存する。当サイトでは以下の通り。

../css_nuc/nuc.css

君:これは単にコピペで済むわね。

私:そう、簡単。問題なのが　nuc.png　と言う名前の画像。アクセント核に鍵記号を付けるための画像だ。ＮＨＫ等、ネットからダウンロードすればよい。当サイトでは　

https://sashichi-ohnishi.readymade.jp/hida_dialect/css_nuc/nuc.png

で、自由にダウンロードできます。

君:続いてのステップは。

私: htl header に　

<link rel="stylesheet" href="../css_acc/nuc.css">

を書き足す事。これで準備は完了だ。続いてはアクセント核を付けたい文字の前後を、例えば

<span class="nuc">パ</span>ンダ

というように囲むだけ。

君:慣れれば簡単という事ね。

私:うん、すぐに出来るようになる。要点としては、上記のＣＳＳ定義ファイル及びＰＮＧ画像はサイト内のわかりやすい場所に格納しておいて、使いまわす事だ。ただしルートに格納するのはよくない。当サイトでもアクセント核表記の記事を書かねばならないのはアクセント学のコーナーのみ。私がルートに収納しているのは全てのページの共通デザインであるＣＳＳファイルひとつだけ。当サイトのどのページを見ても色合いが同じなのはそのような仕組みによる。

君:これで念願のアクセント表記の問題が解決したわね。

私:うん、完全解決だ。例えば以下の通り。

アクセント

アクセントヒョーキ(表記)

自由に表現できるようになって気分は極楽です。

君:

それはよかったわね。・・・あるいは

それはよかったわね。

かしら。ほほほ

大西佐七のザ・飛騨弁フォーラム アクセント

アクセントの表記３

戻る

ページ先頭に戻る

大西佐七のザ・飛騨弁フォーラム　アクセント