最近書かれた記事5件分を表示します。
更新状況をRSS 1.0形式でご覧になれます。
CSSには、ボックスに収まり切らない内容の扱い方を指定するoverflowというプロパティがあります。これは表示領域の右端で折り返さない、例えばpre要素などによく用いられます。overflow: auto;またはoverflow: scroll;とすると、指定した要素内にスクロールバーが表示され、収まり切らない内容を見られるようになります。この時、ページ全体の横スクロールバーは出現しません。
meta要素による指定とHTTPレスポンスヘッダの関係のようにpre要素を多用する場合は重宝するプロパティですが、実装されているブラウザとそうでないブラウザがあります。一般的なブラウザの実装状況は次の通りです。
MacIE5には、overflowにvisible以外の値を指定すると要素全体が表示されなくなるバグが存在します。このバグの存在は知っていましたが、実際に確認してみるまで案外気づかないものですね。pre要素に指定しているoverflow: auto;をMacIEに適用しないように修正しました。
HTTPレスポンスヘッダ(HTTP Response Header)とは、リクエストしたデータについてサーバから返される情報です。MIME typeやcharset(文字コード体系)といった情報がその一例です。HTML文書内に記述するmeta要素によってこれらの情報をコントロールできますが、多くの場合、この指定はHTTPレスポンスヘッダには影響せず、UAに対してのみ効果を持つようです。(HTTPレスポンスヘッダにmeta要素の指定を反映させられるサーバもあるそうです。)
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<link rel="stylesheet" type="text/css" href="/foo.css" />
<title></title>
</head>
このようなhead要素を有するHTML文書のHTTPレスポンスヘッダは次のようになります。
HTTP Status Code: HTTP/1.1 200 OK
Date: Tue, 18 May 2004 11:51:23 GMT
Server: Apache/1.3.29 (Unix) PHP/4.2.4-dev
Last-Modified: Tue, 18 May 2004 10:29:58 GMT
Accept-Ranges: bytes
Content-Length: 3601
Connection: close
Content-Type: text/html
最終行のContent-Typeには、meta要素で指定したcharset=UTF-8が含まれていないことが分かります。Content-Style-Typeに関しては、それ自体が含まれていません。
meta要素はUAが解釈してくれるので問題がないように見えますが、言い換えれば、UAが解釈できなければ問題が発生することになります。一般的なWWWブラウザでは問題ありませんが、Netscape Communicator 4.xなどの一部のUAでは稀に文字化けすることがあります。
これを解決するには、.htaccessを利用します。次のように記述することで、拡張子htmlを持つファイルのContent-Typeに文字コードを指定することができます。HTTPレスポンスヘッダにも反映されます。
AddType "text/html; charset=UTF-8" html
Content-Style-Type、Content-Script-Typeについても、.htaccessで指定することができます。ただし、モジュールmod_headersが利用できる場合に限られます。
Header set Content-Style-Type: "text/css"
Header set Content-Script-Type: "text/javascript"
これらの設定を行った後のHTTPレスポンスヘッダは次のようになります。(HTML文書には手を加えていません。)
HTTP Status Code: HTTP/1.1 200 OK
Date: Tue, 18 May 2004 12:21:13 GMT
Server: Apache/1.3.29 (Unix) PHP/4.2.4-dev
Content-Style-Type: text/css
Content-Script-Type: text/javascript
Last-Modified: Tue, 18 May 2004 10:29:58 GMT
Accept-Ranges: bytes
Content-Length: 3601
Connection: close
Content-Type: text/html; charset=utf-8
Content-Style-Type、Content-Script-Type、charsetの指定が反映されています。従って、.htaccessを用いてこれらの設定を行う場合、HTML文書内のmeta要素におけるContent-Type、Content-Style-Type、Content-Script-Typeの指定は、必ずしも必要ではありません。
拡張子.phpを持つファイルに対しては、.htaccessによるAddTypeの指定が無効になります。文字コードを設定するには、ファイルの先頭でheaderを指定します。
<?php
header ("content-type: text/html; charset=UTF-8");
?>
半年のベータテストを経てOpera 7.50が正式にリリースされました。現在は英語版のみ利用可能です。
7.50ではRSSのリーダが実装されており、Everything You Need Online
というキャッチコピーにも頷けるところです。