airistestのブログ

airistestのブログ

ブログの説明を入力します。

Amebaでブログを始めよう!

コピペした後の、、、、、、、、、


通常表示とHTML表示での編集について

 

*文字入力*

見出しの文字の大きさや色、問い合わせ先のリンクなど統一したいものがあるので、コピー&ペーストして編集していきます。ニコ

 

通常表示で文章の途中で書体の大きさや色を変えたいときは、画面タイトルの下の書体編集ツールを使えばできます。合格

もちろんHTML表示上でも変更が反映されています。

 

*画像の挿入*

上矢印上のように画像を挿入する場合は、編集画面の画像を挿入したいところにカーソルをあわせてから、下矢印下のように、がさすマークを選択してのように保存先からドラックするだけです。

 

*文章と画像の保護

子供たちの写真やコメントを掲載していることから個人情報については配慮が必要となってくると思います。そこでソースコードに

<body oncontextmenu="return false">を入力することによって画像も文章もコピーをさせないようにできます。(現在はどの写真も右クリックでコピーできる状態)

とはいへ、いろいろな方法があるので完璧に画像をまもることはできませんが、ある程度防ぐことはできると思います。

 

*枠について*

枠の中の文章も通常表示画面で編集できます。

下矢印ソースコード

<div style="background: rgb(255, 238, 238); padding: 10px; border: 2px dotted rgb(255, 0, 0); border-image: none;">
<p style="text-align: left;">枠の中の文章も通常表示画面で編集できます。</p></div>

 

色を変更してみます。(変更箇所赤字)

下矢印ソースコード

<div style="background: rgb(238, 238, 255); padding: 10px; border: 2px dotted rgb(0, 0, 255); border-image: none;">
<p style="text-align: left;">色を変更してみます。(変更箇所赤字)</p></div>

 

枠のドットを大きく変更してみます。(変更箇所赤字)

下矢印ソースコード

<div style="background: rgb(238, 238, 255); padding: 10px; border: 4px dotted rgb(0, 0, 255); border-image: none;">
<p style="text-align: left;">枠のドットを大きく変更してみます。(変更箇所赤字)</p></div>

 

その他1

 

その他2

 

その他3

 

■その他4■

本文

 

可愛らしい枠のソースコードを紹介してくれているブログが多数あるので参考にできます。音譜