タグ

文章とcssに関するsisicomのブックマーク (2)

  • 段組みを使って縦書きの文章をレスポンシブ対応させる方法

    2018年7月26日 CSS, Webサイト制作 CSSで文章を縦書きにする表現、少しずつ目にする機会が増えてきたように思います。しかし、縦書きのコンテンツをレスポンシブ対応させるのはなかなか大変。様々なサイトを見てみましたが、文章を横にスクロールしたり、文字サイズを調整してなんとかモバイルに対応しているようです。今回はたった一行でそんな問題を解決する方法を紹介します。 ↑私が10年以上利用している会計ソフト! 縦書きの設定 縦書きを設定するのはとっても簡単!縦書きにしたい箇所にCSSで writing-mode: vertical-rl; を記述します。この「vertical」が縦、「rl」が右から左(Right to Left)という意味です。 また、IE用には別の書き方になります。 -ms- というベンダープレフィックスを付け、tb-rl(上から下、右から左=Top to Botto

    段組みを使って縦書きの文章をレスポンシブ対応させる方法
    sisicom
    sisicom 2018/07/11
    縦書きが出来るの?!
  • [HTML5 入門]実制作で迷わない為のマークアップ例:会話文

    文書構造を意識したマークアップ例 今回から始める不定期連載です。HTMLのコーディングのやり方はリファレンスサイト等で例文を用いて行われることが多いですが、どうも抽象的だったり、実際の運用に即していない印象のものが多く見られるように感じています。 仕様に関する解説やコードの書き方も、遠まわしだったり、「だから結局どう書けばいいの?」という感は拭えません。また、ドキュメント自体が書かれた地域の文化を基準にしており、我々日web制作現場の実際にそぐわない場合もありますよね。 こういったことについて、一つ一つ実際の事例や具体的な使われ方を挙げながらHTMLCSSのコーディングについて解説したいと思います。 また、この連載にはブログの記事と同じく私個人のHTML5のマークアップに対する考え方が強く織り交ぜられることと思います。もし見解の相違などありましたらご意見頂きたいと考えています。 シン

    [HTML5 入門]実制作で迷わない為のマークアップ例:会話文
    sisicom
    sisicom 2014/10/16
    新しいタグ、あんまり使わなかったけど、使い方次第で便利になるね
  • 1