WEBデザイン WordPressの改行問題 最終結論 【なんだコレで良かったんだ】
WordPressには自動改行問題というのがありました、これに関しては、使いたくなければ機能を停止してしまえばOKですね。 ⇒ WordPressの改行問題の解決方法 しかし、自動改行はしてほしくないけれど、機能を切ってしまうと今度は改行し...
CSS
WEBデザイン 
WEBデザイン Flexbox と Gridレイアウトの使い分け
1 2 3 4 1 2 3 4 A B C D E F G H I Flexbox と グリッドレイアウトの特徴(違い)は Flexboxは一列に並んでいく（折り返すにしても） Gridレイアウトは縦横のマス目状に配置するもの という感じで...
WEBデザイン Gridに挑戦 ライン指定型
Gridレイアウトの指定の仕方は二種類、エリア名で指定する方法と、ライン番号で指定する方法がある。 エリア型のほうが分かりやすそうなので、それでやってみた。 前回Gridレイアウトのエリア名による指定の仕方を試したので、今回はライン番号で指...
WEBデザイン ベンダープレフィックスを自動で入れてくれるサービス
Flexboxやグリッドレイアウトなど、比較的新しい機能を使おうとすると、古いブラウザでレイアウトが崩れてしまう事がよくあります。 そのため、WEBデザインが完成したあと、できるだけ多くのブラウザで表示を確認、ということが必要になります。 ...
WEBデザイン gridレイアウトに挑戦 ー エリア名指定型
Flexboxがある程度分かったので、次はGridレイアウトに挑戦 FlexboxとGridレイアウトの違いと使い分けは後回しにするとして。 とりあえずGridレイアウトを作ってみた。 Gridレイアウトの指定の仕方は二種類、エリア名で指定...
WEBデザイン box-sizing:border-box; は子要素に継承されない
今更なのですが、ボックスサイジングの話（おさらい） ボックスサイジングとは？ デフォルトでは、box-sizingの値はcontent-boxになっています。 content-boxだとどうなるか？ ボーダー(枠線)の太さが、コンテンツの幅...
WEBデザイン Flexboxの縦並びを使って２カラムデザイン
下記のように２カラムのデザインを考える時 testtest test 通常は、左右２つの領域に区切ってから testtest さらに右の領域の中に新たに上下に区切るように領域を作る、という風にするわけですが。 test test test ...
WEBデザイン HTML5におけるタグの入れ子覚え書き
HTML5ではインライン要素・ブロック要素という概念がなくなった。 なくなっただけではなく、代わりに、何をどのタグの中に入れられるのかを定義する別の方法(コンテンツモデル)が規定された。 （※「コンテンツモデル」とは、「その要素内にどんなカ...
WEBデザイン <style>を記事内に書くのは間違いではなくなった(HTML5.2)
昨年末、HTML5.2が正式勧告となり、これまでＮＧとされてきた<BODY>タグ内のスタイル指定が、ＯＫになってたんですね、知りませんでした。 今後は、ブログの記事の中に↓のように書いても <style><!-- selecter{ pro...
WEBデザイン WEBフォントはやはり重かった・・・
ちょっとフォントの設定でレイアウトが崩れる問題で悩んでいたこともあり ※「serif」「sans-serif」「monospace」「cursive」「fantasy」は「総称ファミリ名」(generic font family)と呼ばれ、...
WEBデザイン OLのリストで、カッコ付きの番号にする方法【覚書】
括弧付きで数字を頭に振った箇条書きの文章を挿入したいことがよくあります。 こんな感じにしたい。 (1)ひとまず何はともあれ、そうした幸福・仕合せのための偽りは、尊敬を自己についにもたらすために言ってくれるなら。 (2)それで場合によっては、...
WEBデザイン <PRE>要素は危険らしい・・・？
前に、「<pre>の中にはブロック要素を入れてはいけない」と言う記事を書きました。 とりあえず、反省して以降の記事の書き方は、必ず記事のサブタイトルは見出しタグ(H1～H6)、記事本文には<P>または<PRE>要素で括るようにしました。 そ...