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

HTML：HTMLで並べた画像の余白を取り除く方法

Posted on by
返信

HTMLで画像を並べて表示しようとしたのですが、画像と画像の間に余白が入ってしまい、ぴったりくっつかないということがありました。

image_yohaku_1

その時のHTMLのソースコードは以下のように記述しています。

<img src="image_1.jpg" />
<img src="image_2.jpg" />

調べてみるとソースコード内で<img>タグを改行して記述していたり、半角のハイフンなどが入っていると画像の間に余白が入ってしまうようです。

なので、画像の間の余白を取り除く場合の解決策をメモします。

■ 並べた画像の余白を取り除く方法

ソース内で<img>タグの間に改行や空白を入れないで記述した場合、余白はできないので下記のように記述します。

<img src="image_1.jpg" /><img src="image_2.jpg" />

また、ソース内の記述を見やすくするために改行したり空白を入れたい場合があります。
その場合は画像に「float: left;」を指定し余白をなくします。

<img src="image_1.jpg" style="float: left;" />
<img src="image_2.jpg" style="float: left;" />

上記の方法を使用すると下記のように複数の画像がぴったりくっついて表示されます

image_yohaku_2

CSS：text-shadowを使用し、文字に影や縁取りをする

Posted on by
2

CSS3のtext-shadowを使用すれば、画像で作ったように文字を装飾することができます。
text-shadowを使用して、文字に影を付けたり、縁取り（アウトライン）をする方法をメモします。

text-shadowは文字に影を付けるプロパティです。

[text-shadow]

text-shadow: 横方向 縦方向 ぼかし 影の色;

使用例は下記のように指定します。

text-shadow: 5px 5px 1px #999999;

text-shadow1

設定する値を複数指定したい場合は下記のように’,’区切りで指定します。

text-shadow: 5px 5px 1px #999999, -5px -5px 1px #999999;

text-shadow2

noneを指定した場合、影は付きません。

■ 文字に影を付ける場合

【CSS】

.test {
	color: #000;
	font-size: 50px;
	font-weight: bold;
	text-shadow: 5px 5px 1px #999999;
}

【表示例】

text-shadow1

■ 文字に縁取りをする場合

【CSS】

.test {
	color: #FFF;
	font-size: 50px;
	font-weight: bold;
	text-shadow: 2px 2px 1px #00F,
	-2px 2px 1px #00F,
	2px -2px 1px #00F,
	-2px -2px 1px #00F;
}

【表示例】

text-shadow3

php：文字列の先頭・末尾の文字を指定文字で削除する

Posted on by
返信

phpで文字列の先頭や末尾の文字を削除したい場合があります。

ltrim()とrtrim()を使用すれば、指定した文字で削除することができます。
また、ltrim()とrtrim()は削除文字を指定しない場合、先頭や末尾の空白を削除します。

phpのltrim()とrtrim()を使用し、文字列の先頭や末尾の文字を指定文字で指定して削除する方法をメモします。

■ ltrim()を使用し、先頭の文字を削除する

・先頭の空白を削除する場合
※全角の空白は削除されません。

【php】

$str = '   abcdefg';
$str = ltrim($str);
var_dump($str);

【出力結果】

string(7) "abcdefg"

・削除文字を指定し、先頭の文字を削除する場合

【php】

$str = 'abcdefg';
$str = ltrim($str, 'abc');
var_dump($str);

【出力結果】

string(4) "defg"

■ rtrim()を使用し、末尾の文字を削除する

・末尾の空白を削除する場合
※全角の空白は削除されません。

【php】

$str = 'abcdefg   ';
$str = rtrim($str);
var_dump($str);

【出力結果】

string(7) "abcdefg"

・削除文字を指定し、末尾の文字を削除する場合

【php】

$str = 'abcdefg';
$str = rtrim($str, 'efg');
var_dump($str);

【出力結果】

string(4) "abcd"

Javascript：選択したラジオボタンのチェックを外す方法

Posted on by
返信

ラジオボタン選択後にチェックしたものを外したい場合があります。
Javascriptを使用すればチェックしたラジオボタンをリセットすることが可能です。

Javascriptを使用し選択されているラジオボタンのチェックを外す方法をメモします。

■ 選択したラジオボタンのチェックを外す

【HTML】

チェックを外すためのリンクを用意し、クリックした際にJavascriptを呼び出します。

<a href="javascript:void(0);" onclick="resetradio()">リセット</a>

ラジオボタンのidを連番で指定します。

<label for="radio1"><input type="radio" name="hoge" id="radio1" value="1" />ラジオボタン1</label>
<label for="radio2"><input type="radio" name="hoge" id="radio2" value="2" />ラジオボタン2</label>
<label for="radio3"><input type="radio" name="hoge" id="radio3" value="3" />ラジオボタン3</label>
<label for="radio4"><input type="radio" name="hoge" id="radio4" value="4" />ラジオボタン4</label>
<label for="radio5"><input type="radio" name="hoge" id="radio5" value="5" />ラジオボタン5</label>

【javascript】

呼び出されたらラジオボタンの数だけfor文でループさせ、ラジオボタンのチェックを外しています。

<script type="text/javascript">
function resetradio() {
    for (i = 1; i <= 5; i++) {
        document.getElementById('radio' + i).checked = false;
    }
}
</script>

さくらインターネット：レンタルサーバでドメインごとに同じメールアドレスは登録できない

Posted on by
返信

さくらインターネットのレンタルサーバでは、ドメインごとに同じメールアドレスを追加することができないようです。

下記のように「info@～」のメールアドレスをドメインごとに作成したい場合があります。

■ 追加したいメールアドレス

※「hoge.com」と「test.com」のドメインを設定している場合

info@hoge.com
info@test.com

しかし、さくらのレンタルサーバでは上記のアドレスは同じメールアドレスとして認識されてしまいます。

さくらのサポート情報サイトに載ってました。

sakura_mail

http://support.sakura.ad.jp/manual/rs/mail/setmail.html

なので、さくらのレンタルサーバではドメイン毎に同じメールアカウントを登録することはできません。

複数のドメインを設定する場合は注意が必要です。