月別アーカイブ: 2013年5月

.dwtを更新したらCSSがリンク切れになった時

 

ホームページ制作の効率化のためにサイドバーやヘッダー、フッターをテンプレート化することがあります。
更新すると全部のページに反映されるはずですが、されないときの対処法は以下です。

もっと詳しい説明を見る

———————————————————————
ftpから最新ファイルを全部ローカルに落としてくる

「サイトの管理」ルートフォルダを選択しなおして正しいディレクトリを認識させる

「ファイル名.dwt」その他「ファイル名.html」cssを修正。
ここで
「ファイル名.dwt」を保存すると、ファイル名.htmlが更新される。
されない場合は修正メニュー→テンプレート→テンプレートをページに「適用」

完成したら、この時点でファイルサーバーに保管する。
ファイルサーバーで作業すると、パスが複雑過ぎて壊れ、リンク切れなどを起こしてしまいます。

———————————————————————

しかし、テンプレートを更新して、htmlを全部書き換えるのには成功したら、画像やcssがリンク切れを起こした!
ときの対処法です。

?やり直しになるので、サーバーからローカルにデータをコピーしなおして始めます。

→テンプレート.dwtを作業します。出来たら保存します。ここで、一気に反映させない。
保存した瞬間このテンプレートを使うローカルサイト内部の全ドキュメントを更新しますか?とウィンドウがでるので
「いいえ」にしておく。
→そのあと個別にhtmlを開いて、一個一個テンプレートを更新して、反映させる。
これならうまくいきます。

Dreamweaver-パネルでcssを作成しよう!-カテゴリ「ボックス」

「Dreamweaver-パネルでcssを作成しよう」第4回目はカテゴリ「ボックス」プロパティを見直していきます。
(前回のカテゴリ「ブロック」はこちら)

width
横幅を指定します。
height
高さを指定します。
Float
配置を指定します。

left
左寄せの指定をします。またはその後に続く要素に関しては、左寄せに指定した要素の右に回り込みをするよう指定します。

right
右寄せの指定をします。またはその後に続く要素に関しては、右寄せに指定した要素の左に回り込みをするよう指定します。

none
特に何も指定しません。

clear
回り込みの解除を行います。

left
左寄せされた要素の回り込み解除を指定します。

right
右寄せされた要素の回り込み解除を指定します。

both
右又は左寄せされた全ての要素の回り込み解除を指定します。

none
回り込み解除はしません。

padding
余白の指定をします。marginはある領域とある領域の間の余白であるのに対し、paddingはひとつの領域の中での余白です。

top
上の余白を指定します

right
右の余白を指定します

bottom
下の余白を指定します

left
左の余白を指定します

margin
余白の指定をします。paddingはひとつの領域内での余白であるのに対し、marginはある領域とある領域の間の余白です。

top
上の余白を指定します

right
右の余白を指定します

bottom
下の余白を指定します

left
左の余白を指定します

img01_02

marginやpaddingはショートハンドプロパティを使用することで表示を簡潔に整理することができます。
padding: {10px 20px 30px 40px;} (左側(10px)から、上右下左)
padding: {10px 20px 40px;} (左側(10px)から、上・左右・下)

ちなみに、divなどで囲ったおおきなボックス(くくり)を、web上の画面内で
左右に対しまん中表示させる際には、
margin:0 auto; (上下は0、左右はauto)指定をします。
webサイト全体が画面の左寄せで表示されているサイトが今でもよくみられますが最近では画面センターで表示されるよう設定するのが通常です。