Category: HTML+CSS

  • ホームページで使うフォントと指定の注意

    ホームページで使う文字のフォントは、一般的にはどのパソコンでもインストールされているフォントを指定するのであり、筆文字のような別途インストールを要するフォントは、画像として表示させます。但し「どのパソコンでもインストールされているフォント」などという日本語フォントはないのが現状。Webフォントなる方法がありますが、日本語においては、これからの発展を期待するのが個人的な見解です。 日本語においては CSS の font-family で Windows と Mac のそれぞれの環境でのフォントを指定するのがベターと思われます。 当オフィスにおきましては、次のように記述しています。 「”MS Pゴシック” は必要か?」というお声が聞こえてきそうですが、諸事情により残しています。 上の記述でおわかりになるかと思いますが、CSSファイルで「ヒラギノ角ゴ」「メイリオ」などの日本語が記述されます。先般、既存の CSS 編集のご依頼があり、該当ファイルを開いたところ、上述の font-family 部分が文字化けしていました。HTMLファイルでは meta タグで文字コードを指定することと同じく、CSS でも文字コードの指定があります。「@charset “utf-8”;」は先頭に必ず記述しましょう。 [mokurenCB]

  • ※印のある注釈で2行目以降を右にずらしたい

    「※印」を含めた注釈でよくみられる記述は以下の通り。 注釈の内容が1行で済むような短い文章の場合は問題ないですが、複数行に至る場合、2行目以降の1文字目と1行目にある※印の縦位置が同じになってしまう。 例えば、以下。 ※注釈1行目注釈2行目注釈3行目 上記の場合では「※印」が目立たなくなってしまうので、「※印」だけを左にだしたい! ※注釈1行目注釈2行目注釈3行目 こんな感じ。上記は何をしているかと申しますと CSS で以下のような指定をしています。 text-indent: -1em; で文章の1文字目を1文字分だけ左にずらし、padding-left: 1em; で文章全体を1文字分右にずらしています。 昔、雑誌で目にし、それ以来使っている方法です。たまに「どうやるの?」と聞かれることがあるので。