.p-large { HTMLをはじめて書くときにも、ブログでちょっと見た目を調整するときにも、たくさん出てくるbrタグ。これは、文章を改行するときに使うタグです。でも多用すると読みづらくなってしまうこと、知ってましたか? 今回は、brタ … HTMLでの改行の仕方について解説します。brタグの使い方とそれ以外の方法も総まとめ! 1行空けるときの理想的な方法についても触れています。 今回は、WEBでなぜ「br」タグを連打しない方がいいかという話です。実はこれ、人間にとっては「br」だろうが「p」だろうが同じなんですが、Googleにとってはまったく違うんです。 ©Copyright2020 nuconeco.All Rights Reserved. CSSに以下のようなものを追記します。, marginは要素まわりの余白を指定するCSSのプロパティですね。margin-bottomなので、要素の下側のスペースを指定しています。, 余白調整したくなったら、さきほどCSSで指定しておいたクラス名を追加します。大きめの空白を空けたいときには、さきほどの.bsを使います。, おそらく、余白調整用のCSSの優先順位が低かったからだと思われます。pタグや見出しタグなどにもともと指定されている余白指定が優先されてしまっているのです。 ©Copyright2020 nuconeco.All Rights Reserved. おおー! それから、やっとせいせいしたというようにぐっすりねむりました。

次の晩もゴーシュが }, セロ弾きは扉をあけて猫が風のように萱のなかを走って行くのを見てちょっと margin-bottom:-1em; というわけで、あまり使う機会はないかと思います。, CSSのwhite-spaceの使い方:pre、wrap、nowrapなどの違いは?, brタグにスラッシュが入った
を見かけることもあるかと思います。これは
と全く同じように改行の働きをします。

セロ弾きは扉をあけて猫が風のように萱のなかを走って行くのを見てちょっとわらいました。 WEB制作に関わっている方にはお馴染みのタグと言えば
、もしくはタグです。5年前ぐらい前までは何かとお世話になっていたこのタグですが、徐々に嫌われるようになってきました。, なぜを使わない方が良いのでしょうか?その理由はこの一言で終わってしまうのですが、そうなんです。, WEBコンテンツをWindowsとかMacで書くと、普通はPC用のモニターに合わせて改行をすると思います。文字の横幅って、スマホだと大分狭いんですよね。スマホどころか、デスクトップでもモニターが違えば改行の位置もずれちゃうんです。, なので、デバイスの多様化に対応するために「改行タグ」は一切使わなくなったというわけ。, まずはパソコンのモニターで見た時にバッチリに見えるように改行しているけど、スマホで見るとアレ?な例です。, 読みやすいように意図的に入れた改行と見事にズレまくっています。とくに1、2文字で改行が入っているのはウザすぎですよね。, ではさっそく直しましょう。全部の改行を取ります。段落はもちろん

で囲んでいます。, パソコンで見ても問題なく見られますよね。ただ、

の横幅を調整しないと一列の文字数が多すぎて見づらくなるのでご注意下さい。. HTML5が導入されてから、3年が過ぎています。導入が2014年でしたもんね。私のようにHTML5からの人もそうだけど、古くからHTMLを触っている人で、古い「タグ」を未だに使っていませんか?実は、HTML5になってから、“使ってはいけないタグ”があります。, HTML5で廃止された「タグ」をしっかり理解して、今後に備えるようにしたいですよね!なので、今から紹介するタグを覚えておくといいかもですね。, 先程紹介したタグは、「原則」使用禁止です。正確に言うと、禁止ではなく「サポートをしなくなっても知らないよ?」ということです。, ただし、これらのタグの中にはサポートを続けるのもあるので、現状使っていても問題ないものもあります。などがそれに該当するようですね。, ただ、そうは言っても廃止方向になっているのは事実なので、できるだけHTMLに直接これらのタグを打つのは避けたほうが良さそうですね。, やはり、CSS3が導入されているので、HTML内でマークアップして、CSSで記述する。というのが理想だと思います!, 直接書いた方が楽、と思ってしまいますけど、後での管理を考えたらCSSで記述するほうが、断然楽ですよ。, この箇所だけ変えたいのにCSSは面倒・・・。そんなあなたには、