WEB SCOPE Elements

  リダイレクト



同一ドメインで使用できます

JavaScript が動作しない場合に有効

  
<META http-equiv="Refresh" content="0;URL=http://winofsql.jp/">
  

  
<?php

	$str='';
	$str.="<META http-equiv=\"Refresh\" content=\"0;URL=http://winofsql.jp/\"> ";
	$str.="";
	print $str;

?>
  

▼ 関連リンク
javascript を出力するコードの作成







  キャラクタセット



  
<META http-equiv="content-type" content="text/html; charset=SHIFT_JIS">
  

  
<META http-equiv="content-type" content="text/html; charset=EUC-JP">
  

  
<META http-equiv="content-type" content="text/html; charset=UTF-8">
  

  
<META http-equiv="content-type" content="text/html; charset=ISO-2022-JP">
  

HTML ( PHP や ASP 等スクリプト以外 ) はHTTP ヘッダを出力するかわりに META タグで指定。


  • 【SHIFT_JIS】

    • WEB アプリからすると、SHIFT_JIS は鬼門。
    • 但し、PDF 利用時には、クライアントのフォントを使用せざるを得ないので SHIFT_JIS 系となる。


  • 【EUC-JP】

    • 一般的に WEB 上のレンタルスペースは、DB も含めて EUC で構成されている。
    • 最も大きな選択肢


  • 【UTF-8】

    • ブラウザのAPI的には、UTF-8 に変換されるので、特に選択する理由は無い。
    • また、PHP や、Perl で( 特に Perl ) 面倒な知識が必要なので避けたほうが無難。


  • 【iso-2022-jp】

    • いわゆる JIS。HTML メールを送る時の本文に日本語使う場合





  フレーム

<HTML>
<HEAD>
<TITLE>タイトル文字列</TITLE>
<META http-equiv="content-type" content="text/html; charset=EUC-JP">
</HEAD>
<FRAMESET id="TopFrame" cols="400,*">
	<FRAMESET id="NextFrame" rows="200,*">
		<FRAME name="Logo" src="a.html">
		<FRAME name="Ctrl" src="b.html">
	</FRAMESET>
	<FRAME name="Act" src="c.html">
</FRAMESET>



境界なし
<HTML>
<HEAD>
<TITLE>タイトル文字列</TITLE>
<META http-equiv="content-type" content="text/html; charset=EUC-JP">
</HEAD>
<FRAMESET id="TopFrame" cols="400,*" framespacing="0" frameborder="0">
	<FRAMESET id="NextFrame" rows="200,*">
		<FRAME name="Logo" src="a.html">
		<FRAME name="Ctrl" src="b.html">
	</FRAMESET>
	<FRAME name="Act" src="c.html">
</FRAMESET>


境界変更不可
<HTML>
<HEAD>
<TITLE>タイトル文字列</TITLE>
<META http-equiv="content-type" content="text/html; charset=EUC-JP">
</HEAD>
<FRAMESET id="TopFrame" cols="400,*" framespacing="0" frameborder="1">
	<FRAMESET id="NextFrame" rows="200,*">
		<FRAME name="Logo" src="a.html" noresize>
		<FRAME name="Ctrl" src="b.html" noresize>
	</FRAMESET>
	<FRAME name="Act" src="c.html" noresize>
</FRAMESET>








  スタイルシート

↓スタイルシートの参照
  
<LINK rel="stylesheet" type="text/css" href="style.css">
  


1) 全称セレクタ ( 全て )
2) タイプセレクタ ( 要素 )
3) クラスセレクタ
4) 子孫セレクタ ( ある特定要素の子孫(下位の階層)にあたる要素にマッチ )
5) IDセレクタ
6) グループ化

  
<STYLE type="text/css">

* {
	font-family: Verdana,'MS Pゴシック';
	font-size: 13px;
}

INPUT {
	font-family: Verdana,'MS Pゴシック';
	font-size: 40px;
}

.classname {
	font-family: Verdana,'MS Pゴシック';
	font-size: 20px;
}

DIV SPAN {
	font-family: Verdana,'MS Pゴシック';
	font-size: 30px;
}

#center {
	font-family: Verdana,'MS Pゴシック';
	font-size: 70px;
}

#mydiv, H1, .red {
	background-color: red;
}

</STYLE>
  



  DIV を使った、親エレメントからの絶対位置指定

DIV はその親エレメントの自動レイアウトに従い、DIV 内の エレメントは、
DIV を基準に好きな位置に配置できる

1) DIV には、position:relative
2) その内部では、postion:absolute

※ DIV に position:relative を指定しないと、ページの左上が基点となる

  
<TABLE border="1">
<TR>
<TD width=100 height=100>A</TD>
<TD width=100 height=100 style='vertical-align:top'>

	<DIV style='position:relative'>
		<SPAN style='position:absolute;left:-10px;top:-10px'>B</SPAN> 
	</DIV>

</TD>
<TD width=100 height=100>C</TD>
</TR>
</TABLE>
  

A
B
C



  スクロールする DIV

長い文章を小さなエリアで表示するのに有効です。

  
<DIV
	style='
		border-style:solid;
		border-width:1px; 
		border-color:black;
		overflow:auto;
		width:300px;
		height:80px;
	'
>
あああああああああああああああああああああああああああああああああああああああああああああ<br>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa<br>
bbbbb bbbbb bbbbb bbbbb bbbbb bbbbb bbbbb<br>
あああああ あああああ あああああ あああああ あああああ<br>
<br><br><br><br><br><br><br><br>
</DIV>
  

あああああああああああああああああああああああああああああああああああああああああああああ
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
bbbbb bbbbb bbbbb bbbbb bbbbb bbbbb bbbbb
あああああ あああああ あああああ あああああ あああああ









しかし、これでは空白文字を含まない表示幅以上の長さを持つ半角文字が横スクロールしてしまいます。
IE ならば、word-wrap:break-word を指定します

あああああああああああああああああああああああああああああああああああああああああああああ
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
bbbbb bbbbb bbbbb bbbbb bbbbb bbbbb bbbbb
あああああ あああああ あああああ あああああ あああああ


















  infoboard   管理者用   
このエントリーをはてなブックマークに追加





フリーフォントWEBサービス
SQLの窓WEBサービス

SQLの窓フリーソフト

素材

一般WEBツールリンク

SQLの窓

フリーソフト

JSライブラリ