Kinopyo's Blog

I love this game.

アーカイブ

Posts Tagged ‘HTML’

各画像を一つにまとめてbackground-positionで指定するのは?

2010年05月08日

まずGoogleが実際使っている画像ファイルを見てみましょう。

Googleの各アイコン

いろんな画像、アイコンが混じっていますね。

そして実際使うときはCSSのbackground-positionで表示するモノを指定しているようです。

例えば検索結果の星マークのCSSを見ると

background-position: -117px -117px;


Webサーバとのコネクションが1回で済むので、

それが狙いですね。


background-positionに関しての説明は:

background-position-スタイルシートリファレンス

ちなみにこういることをやってくれるライブラリもあるようです。

使ったことはまだないですけど。

http://csssprites.org/

IE6でSSL(https)に接続する時、src属性なしのiframeを使うとセキュリティの警告が出る

2010年04月27日

現象

IE6を使ってSSL(https)経由で接続する時に以下の警告が出るなら

iframeのsrc属性をまずチェックしてください。

security-info


このページにはセキュリティで保護されている項目と保護されていない項目が含まれています。

ダメな書き方

<iframe />
<iframe src="" />

解決策

src属性にちゃんと値を設定するか、javascriptでfalseを指定する

<iframe src="/dummy.html" />
<iframe srec="javascript:false" />

存在しないファイルを指定するとサーバ側のログにエラーが出るかもしれないので、

設定する場合は実際存在するファイルを設定してください。

jsp内のコメントアウトはjsp式の記述で

2010年02月17日

基本

多分ほとんどの人は分かっていると思いますが、

jspファイル内のコメントの記述は以下になります。

<%-- JSPのコメント --%>

そしてHTMLのコメントの記述は

 <!-- HTMLのコメント -->

問題

SP内でもHTMLのコメント記述が使えますが、

コメントアウトした部分にJavaプログラムが埋め込んだ場合

そのコードは実はコンパイルされてしまいます。

例えば、

<!-- コメントアウト
<input type="text" value="<%= request.getNotExistMethod() %>" />
 -->

ここでは全く存在しないJavaのメソッドを書きました。

このままだとJSPがコンパイルエラーになります。

“The method getNotExistMethod() is undefined for the type HttpServletRequest”というメッセージです。

正しい方法

Javaプログラムが埋め込んだコードをコメントアウトするには

JSPのコメント式を記述します。

上記の例で言うとこうなります。

<%-- JSPコメントアウト
<input type="text" value="<%= request.getNotExistMethod() %>" />
--%>

補足

下記のようなコンパイルが通るJavaコードが書かれた場合は、

もちろんエラーは出ないし、 HTMLの部分もコメントアウトされたため画面には何も表示されません。

<!-- コメントアウト
<input type="text" value="<%= request.getContextPath() %>" />
-->

HTML Formの間隔(余白)をmarginで調整

2009年11月03日

目的

f:id:kinopyo:20091103224149g:image

f:id:kinopyo:20091103224150g:image

f:id:kinopyo:20091103224151g:image

見たの通りform前後の余白を消しました。

これはフォームがテーブルなどを跨がる場合に

レイアウトを調整するのに非常に役に立ちます。

方法

formのmarginを0pxに設定します。

<form style="margin:0px;">

またmargin-topmargin-bottomでなどで詳しく指定できます。

マイナス値も入力でき、さらに間隔を縮むめることができます。

参考となったサイト:http://www.1uphp.com/con1/form/form1style.html

Get Adobe Flash playerPlugin by wpburn.com wordpress themes