6日目　HTML・CSS（ボックスモデル）　と　Photoshop

・HTML

linkを貼る

linkを新規ウィンドウで開く場合

・bodyの中に複数同じタグがあり、別々・または同じスタイルシートを適用させたい場合

ーーーーーーーーーーーーーーーーーーーーーーーー

<head>

<style>

p {
color: #FF00FF;
font-size: 28px;
}
p#aa {　　　　　　　　　　/*他のｐタグと別々の適用*/　　　
color: #00FFFF;
font-size: 36px;
}
p.bb {　　　　　　　　　　/*p class同士は同じ適用*/
color: #00FF00;

</style>

</head>

<body>

</body>

ーーーーーーーーーーーーーーーーーーーーーーー

・ボックスモデル

h1,p,p#bottom,p.aaaをひとつの箱にまとめて、同時に適用できる。

下記の場合は

<div>で<h1,p,p#bottom,p.aaa>を囲むことによって全てに同じ

width:600px;
background-color: #666;

のスタイルを適用している

ーーーーーーーーーーーーーーーーーーーーーーーーー

</style>
</head>

<body>
<div id="container">
<h1>大見出し</h1>
<p>本文</p>
<p id="bottom">本文２</p>
<p class="aaa">本文３</p>
<p class="aaa">本文4</p>
<p><a href="http://www.yahoo.co.jp/" target="_blank"><img src="../../img/01.jpg" width="600" height="300" alt="海の景色"></a></p>
</div>
<div></div>
</body>

ーーーーーーーーーーーーーーーーーーーーーーーーーーーー

・photoshop

動きがおかしい時は

Shift+Ctrl+Alt+クリップ

初期設定

環境設定の単位・定規

定規：pixel

文字：pixel

新規作成時

プリセット「web」

・選択ツール

Ctrl+D　解除・削除

Shift+ドラッグ　きれいな円

Alt+Backspace　描画色

Ctrl+Backspace　背景色

Ctrl+A　全選択

Ctrl+0　ウィンドウ画面拡大

・移動ツール

Ctrl+T　画像の範囲

画像の範囲の隅を　Shift+ドラッグ　アスペクト比を崩さずサイズ変更

★空の画像にアヒルを合成する

f:id:chawannmusi:20160130144441j:plain

photoshopが家と学校でバージョンが異なって苦戦した。

疑問、解決しなければならないこと

・新規作成時にWEBのプリセットがない

・レイヤーも何故かロックされている

・複数ファイルを全画面表示してしまうと前のファイルがどこをクリックすればいいのかわからない

WEB、始めました

半年間WEB制作の学校に通います。その記録。

6日目　HTML・CSS（ボックスモデル）　と　Photoshop