| 「画像ＵＰ」 の記事一覧 | ||
| 1/1ページ | ||
画像（複数）のＵＰ方法４
2006-04-21
こんな感じで画像を並べる方法は以下の通り
＜p＞
＜img src="http://www.pwblog.com/user/blueprint/files/1911_s.jpg" alt="CM" style="float:right;"＞＜img src="http://www.pwblog.com/user/blueprint/files/1911_s.jpg" alt="CM"＞
＜/p＞
style="float:right;"をこの場合、
右に寄せたい内容のタグにつけるだけでいい、
後に続く内容が左にくる
style="float:left;"左に寄せたい時はこれ
後に続く内容が右にくる
style="float:none;"これがノーマル状態
文字でも同じことができる
こんな感じだ
Posted by blueprint 21:56:54
画像（複数）のＵＰ方法３
2006-04-12
文字や画像の回り込みの解除もちょっとややこしい
画があってalign="left"で左に寄せているので
文字は画の右に回り込んでしまう
複数の画像を並べた時にジグザクに並んでしまう状態も解除できる
↓
↓
↓
こんな感じでスーペースを入れて画の横から文字をずらすのが
手取り早いが、ちょっと格好つけたいときに使う
（自己満足の世界へようこそ！）
＜br clear="left"＞(実際は＜＞は半角で入力）
を貼り付けた画像用のタグの最後につける
＜img src="http://www.pwblog.com/user/blueprint/files/1534_s.jpg" alt="CM" align="left"＞＜br clear="left"＞
こんな感じ。そのとき、left位置属性は合わせる。面倒臭かったから
＜br clear="all"＞でもいい
＜p style="clear:left;"＞
（回り込みを解除したいコンテンツを入れる）
＜/p＞
この方法でもいける
ちゃんと文字が画の横から下に移動する
画も被らずに縦にならんでくれる
注：以前はｂｒを使用して自動改行にチェックを入れておくと＜br＞が
自動的に付加されて（編集かけた回数だけ重ねて）修正が必要だった
ソフトを修正したのかなぁ
次は画像に対するリンクの枠消しと枠の修飾かなぁ。画像に隣接する文字の位置の調整方法もあげて、忘れても困らんようにしとこ。
この辺のタグはＣＳＳファイルでも良く使うんだよね。
画があってalign="left"で左に寄せているので
文字は画の右に回り込んでしまう
複数の画像を並べた時にジグザクに並んでしまう状態も解除できる
↓
↓
↓
こんな感じでスーペースを入れて画の横から文字をずらすのが
手取り早いが、ちょっと格好つけたいときに使う
（自己満足の世界へようこそ！）
＜br clear="left"＞(実際は＜＞は半角で入力）
を貼り付けた画像用のタグの最後につける
＜img src="http://www.pwblog.com/user/blueprint/files/1534_s.jpg" alt="CM" align="left"＞＜br clear="left"＞
こんな感じ。そのとき、left位置属性は合わせる。面倒臭かったから
＜br clear="all"＞でもいい
＜p style="clear:left;"＞
（回り込みを解除したいコンテンツを入れる）
＜/p＞
この方法でもいける
ちゃんと文字が画の横から下に移動する
画も被らずに縦にならんでくれる
注：以前はｂｒを使用して自動改行にチェックを入れておくと＜br＞が
自動的に付加されて（編集かけた回数だけ重ねて）修正が必要だった
ソフトを修正したのかなぁ
次は画像に対するリンクの枠消しと枠の修飾かなぁ。画像に隣接する文字の位置の調整方法もあげて、忘れても困らんようにしとこ。
この辺のタグはＣＳＳファイルでも良く使うんだよね。
Posted by blueprint 14:53:34
画像（複数）のＵＰ方法２
2006-04-12
さてと、タグの貼り方を書いておかないと
表示したい画像のURLが解れば後は貼り付けるだけなんだけど
＜img src="http://www.pwblog・・・・/files/1534.jpg" alt="Blueprit" width="80" height="23"＞
(実際は＜＞は半角で入力）
と記入すると
と表示されます。画が大きいと記事が回り込む
ブログの記事の中で画の表示位置を調整するには
左に寄せたい時は align="left"
記事の途中にしたい時は align="all"
右に寄せたい時は align="right"
＜img src="http://www.・・・・width="80" height="23" align="all＞
と記入します。どうでしょうか？
表示できる画像のサイズは使用しているデザインに影響される。
片側プラグインでＷidthは３６０（ヘッダーは８００あるけど）ぐらいまでかなぁ
Ｈeightは試しいないが、blogbodyのサイズに影響するので１６０×１６０以内
で止めといた方が記事の表示速度は速い
記事作成メニューの画像ＵＰと同様に別ウィンドで画像を大きく表示にしたい場合は
記事本文に貼り付ける画のＵＲＬに＿Ｓを添付してプレビュー表示にしておいて
1534 s.jpgの Ｓです。 はアンダーバーね
その表示タグに
ボタンを使って画像のＵＲＬのリンクを貼り付ける
こんな感じになる
＜a href="http://www.pwblog・・・・/files/1534.jpg" target="_blank"＞＜img src="http://www.pwblog・・・/files/1534_s.jpg" alt="CM" align="left"＞＜/a＞
赤色の部分がリンクボタンで自動作成される部分
リンク対象は文字でもＯＫ
表示したい画像のURLが解れば後は貼り付けるだけなんだけど
＜img src="http://www.pwblog・・・・/files/1534.jpg" alt="Blueprit" width="80" height="23"＞
(実際は＜＞は半角で入力）
と記入すると
と表示されます。画が大きいと記事が回り込む
ブログの記事の中で画の表示位置を調整するには
左に寄せたい時は align="left"
記事の途中にしたい時は align="all"
右に寄せたい時は align="right"
＜img src="http://www.・・・・width="80" height="23" align="all＞
と記入します。
どうでしょうか？表示できる画像のサイズは使用しているデザインに影響される。
片側プラグインでＷidthは３６０（ヘッダーは８００あるけど）ぐらいまでかなぁ
Ｈeightは試しいないが、blogbodyのサイズに影響するので１６０×１６０以内
で止めといた方が記事の表示速度は速い
記事作成メニューの画像ＵＰと同様に別ウィンドで画像を大きく表示にしたい場合は
記事本文に貼り付ける画のＵＲＬに＿Ｓを添付してプレビュー表示にしておいて
1534 s.jpgの Ｓです。 はアンダーバーね
その表示タグに
ボタンを使って画像のＵＲＬのリンクを貼り付けるこんな感じになる
＜a href="http://www.pwblog・・・・/files/1534.jpg" target="_blank"＞＜img src="http://www.pwblog・・・/files/1534_s.jpg" alt="CM" align="left"＞＜/a＞
赤色の部分がリンクボタンで自動作成される部分
リンク対象は文字でもＯＫ
Posted by blueprint 14:20:12
画像（複数）のＵＰ方法1
2006-04-12
複数の画像をひとつの記事にＵＰする方法。
但し、手間がかかる方法だ。
まず、画像をファイルアップロードメニューでサーバーに転送。
これは、ＢＭより楽だ。
転送後に表示されるファイル一覧のプレビュー画像を右クリック
表示されたメニューの一番下にあるプロパティをクリックする
サンプル画像が出ないファイルはタイトルをクリックする
このＵＲＬをコピー＆ペーストでメモ帳にでも貼り付けて置く
後はimgタグと上のコマンド欄にある、リンクボタンを使って
記事の中の画像を出したいところに貼り付けるんだけど
そのままのファイル名だとスモールサイズプレビューの画になるから
ｈttp://www.pwblog.・・・・・・/files/****_s.jpgの
リンク先のファイル名から _s を抜く
つづく
追記：貼り付ける画が小さすぎると、プレビューで拡大されることがある
但し、手間がかかる方法だ。
まず、画像をファイルアップロードメニューでサーバーに転送。
これは、ＢＭより楽だ。
転送後に表示されるファイル一覧のプレビュー画像を右クリック
表示されたメニューの一番下にあるプロパティをクリックする
サンプル画像が出ないファイルはタイトルをクリックする
このＵＲＬをコピー＆ペーストでメモ帳にでも貼り付けて置く
後はimgタグと上のコマンド欄にある、リンクボタンを使って
記事の中の画像を出したいところに貼り付けるんだけど
そのままのファイル名だと
ｈttp://www.pwblog.・・・・・・/files/****_s.jpgの
リンク先のファイル名から _s を抜く
つづく
追記：貼り付ける画が小さすぎると、プレビューで拡大されることがある
Posted by blueprint 09:51:20
| 1/1ページ |
