< BACK TO "htmlstudy002.htm">

tack Developers Group Homepage!

〜BlueGriffonでウェブページ制作〜

bodyでwidth:98%を設定:

次に、bodyにwidth:98%を指定します。100%ではちょっと不都合があり、98%でパディングなしで。スマホで見やすくしたいというのが目的で す。tableを使うという手がありますが、ただ、tableを使うとリロードで閲覧位置が変わってしまうという不便さがあります。ですから、これをbody で行うようにしたらどうかと思いました。早く気づけよwですね。

まず、
○ウィンドウ下部のタグ階層リストからbodyを選択します。
○「スタイル プロパティ」タブの[スタイルの適用先]のコンボボックスのドロップダウン・リストで、[クラスで指定する…]に設定。
○すぐ右隣りに現れるコンボボックスで自由なclass名を入力します。
○その後にwidthは「スタイル プロパティ」の[大きさ]から[幅]を98%にします(パディングは上下左右に余白を設けます。上下左右別々に余白を設けたい場合には、[すべてのパディングを同じ値にす る]を解除すると、四隅をそれぞれ設定できます)。

body style width 100% - Google 検索

classの再編集:

編集後のclassの再指定は、まず、ウィンドウ下部のタグ階層リストから、語尾に目的のクラス名のついたタグを選びます。そうすると[スタイル プロパティ]に反映されるはずです。

class指定の削除(styleの設定自体は消えない):

エディタで選択範囲内までカーソルを移動。ウィンドウ下部のタグ階層リストから、語尾に目的のクラス名のついたタグをクリックするとその部分が選択されますので、ウィンドウ上の左から3番目のコンボボックスに表示されているクラス名を Deleteして即エンター(Return/Enter)を押します。タグ階層リストのタグの語尾からクラス名が消えます。もしくは、全て消していい場合は、選択後、そこを右クリック(や書式)で[すべての文字スタイルを削除]で文字スタイルを削除します。
ちなみにタグに対する指定が消えるだけで、 styleの設定自体は消えません。

記入URLの折り返し:

URLでは折り返しがうまくいかず、width:98%での幅の設定が意図通りに表示されなくなる。ここを課題にします。
(... 2022R04-0720-WED-1341)

続きは、bodystyle_study_01_002.html へ。

(... 2022R04-0722-FRI-1717)


< BACK TO "htmlstudy002.htm">

<<< bodystyle_study_01_001.html >>>