Home

ホーム>>応用

線を引く

【style=""】内に【border:太さ スタイル 色】を記述して、【style="border:太さ スタイル 色"】とすると指定コンテンツに線を引くことが出来ます。

"border:1px solid #FF7700"を指定した例

コンテンツ

色は背景色・文字色を変えると同じカラーコードを使います。

スタイルの種類

違いをわかりやすくするため線の太さを5pxにしています。

【solid】

コンテンツ

【dotted】

コンテンツ

【dashed】

コンテンツ

【double】

コンテンツ

【outset】

コンテンツ

【inset】

コンテンツ

【groove】

コンテンツ

【ridge】

コンテンツ

個別指定

個別指定を行うことで特定の方向のみ線を引くことが可能です。

個別指定は、borderの後ろに【-指定方向】を記述して【border-指定方向:太さ スタイル 色】とします。

指定方向は【top】【right】【bottom】【left】の四つで、【top = 上】【right = 右】【bottom = 下】【left = 左】となります。

<p style="border-left:1px solid;">コンテンツ</p>
左方向に1pxの線を引く

【ホーム】へ>>

当サイトは初めてWebサイトを作る方向けの解説サイトです。文法は抜きにして"とにかく作って出す"という事を前提に解説しています。

一度作成してみてさらに興味がわいた方は、専門の参考書を読む事をおススメします。

はじめに - Webサイトについて -

1:予め用意するもの
テキストエディタ
画像編集ソフト
2:最低限の知識
拡張子の表示
htmlタグとは
覚えるべき要素
htmlファイルの構成
htmlファイルの保存
htmlファイルの確認
Webサイトの構造とindex.html
相対パス/絶対パス
3:作成手順
【1】保存フォルダの作成
【2】htmlファイルの作成
【3】ファイルを送信
【4】完成
応用
デザインの変え方
背景色・文字色を変える
文字サイズを変える
縦横のサイズを指定する
行揃えの位置を指定する
間隔をあける
線を引く