検索
AND検索
OR検索
トップ
|
リロード
|
新規
|
一覧
|
検索
|
最終更新
|
ヘルプ
Tips/HTML をテンプレートにして作成
メニュー
トップページ
奥村研にようこそ
卒業研究
奥村研Blog
Outlook Live
FUポータル
Wiki編集者
↑
【 メンバー専用 】
:メンバー
:連絡先
:予定
:写真
:ゼミ
ゼミ実験
サーバー仕様・構成
研究成果
Create Travel Map with Moves
未使用ページ
MenuBar を
edit
【 Tips 】
†
Linux
各種サーバ構築関連
web, qmail, Linuxディストリ, ハードウェア, Samba, モニタリング, Tips
Windows
PortableApps.com
TeraTermPro
WSUS
リモートデスクトップ
Tips
その他 古い話題
Hardware
映像端子
ビデオキャプチャ
道具
AVIOSYS_IPSensor9216
NWハードウェア(L2SW,FW)
LAN配線
APC Smart-UPS
CD-R, DVD-R, BD-R
いろいろベンチマーク
USBサーバ
ベンチマーク, Zaurus, その他メモ
VMWare
VMware Workstation
VMware ESXi
VMware player
HTML, Pukiwiki
HTML
Pukiwiki設定
calendar2
XAMPP for Mac OSX
Apache
MySQL
その他
okkun-labにおけるレポート(報告書)Tips
レポート
Android (Java)
Java Tips
Android Tips
SQL
PostgreSQL Tips
AWS
Amazon Ami Linux
etc
MySQL Tips
Amazon API
TEPRA PRO
無線
印刷Tips
福岡市内ICカード比較
Perl Tips
診断くん
(ミラー)
traceping
Pasoli電子錠
福岡市消防局
Tips を
edit
最新の20件
2024-02-19
Tips/Linux/Tips
2024-02-17
Tips/Linux/RaspberryPiOS
2024-02-15
Tips/Hardware/NWHW/Cisco
Tips/Hardware/NWHW/Juniper_Netscreen_25
2022-11-29
Tips/Linux/MySQL
2022-06-12
RecentDeleted
2022-05-28
MenuBar
AutoTicketLinkName
2022-05-03
Tips/Linux/mdadm
2022-04-15
Tips/Hardware/LAN
2021-12-20
Tips/Windows/rsync
2021-10-12
etc/perl
2021-09-20
Tips/Linux/Samba4
2021-01-10
Tips/Hardware/NWHW/Alaxala
2021-01-06
Tips/Linux/BIND9
Tips/Linux/CentOS6
2020-09-15
Tips/Linux/Postfix/Postfix
2020-05-03
Tips/Linux/CentOS7
2019-08-10
Tips/HTML
2019-07-26
Tips/Linux/Apache2
Total:0/Today:0
開始行:
#contents
*テンプレ [#s1478639]
-HTML宣言
--HTML 4.01 Strict DTD
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http:...
---一番正しい(?)HTML 4.01
--HTML 4.01 Transitional DTD
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitiona...
---一部の非推奨属性を認めるHTML 4.01
--HTML 4.01 Frameset DTD
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//E...
---フレームを認めたHTML 4.01
--違い
---個人的には一番正しいらしいStrictを使用することを推奨。
---それぞれ何が違うのかは詳しいサイトにお願いする。
---DOCTYPE宣言 - TAG INDEX~
http://www.tagindex.com/html_tag/basic/doctype.html
-HTML開始
<html lang="ja"> ... </html>
-header
<head> ... </head>
--文字コード
<meta http-equiv="Content-Type" content="text/html; char...
---UTF-8, EUC-JP, Shift_JIS
---JISはWindowsでは使用できなくなりました。
--CSS(外部スタイルシート)推奨
<meta http-equiv="Content-Style-Type" content="text/css">
<link rel="stylesheet" href="http://example.com/example....
--CSS(内部スタイルシート)
<style type="text/css">
<!--
(スタイルシートの記述)
//-->
</style>
--JavaScript
<meta http-equiv="Content-Script-Type" content="text/jav...
<script type="text/javascript" src="http://www.example.c...
--Refresh(自動再読み込み秒数)
---無効
<meta http-equiv="refresh" content="0">
---3秒後にhttp://example.com/hoge/へジャンプする
<meta http-equiv="refresh" content="3;URL=http://example...
---ブラウザの履歴に残る(戻るボタンでこのページに戻れる)...
---恒久的・永続的にジャンプさせるのであれば.htaccessのジ...
---秒数で指定
---0秒で無効
--ページ情報
<meta name="author" content="SUNAGAWA Hiroyuki / すなが...
<meta name="description" content="HTML4.01のテンプレやTi...
<meta name="keywords" content="HTML4.01,テンプレ,Tips">
--検索エンジン制御
<meta name="robots" content="noindex,nofollow">
--favicon(お気に入りやアドレスバーのアイコン)
<link rel="icon" href="http://www.example.com/icon.png" ...
<link rel="icon" href="http://www.example.com/icon.ico" ...
<link rel="shortcut icon" href="http://www.example.com/i...
--ページタイトル
<title>HTMLテンプレート</title>
-body
<body> ... </body>
--onload="" にJavaScriptを含めるとページを表示したと同時...
*HTML に関する Tips [#g18320bf]
-全画面表示を開く
<A href="http://www.google.co.jp/"
onclick="window.open('http://www.google.co.jp/','subw...
全画面
</A>
-TABLEの罫線を実線にし、印刷させる。
<STYLE type="text/css">
<!--
TABLE{
border-color: #3399ff;
border-collapse: collapse;
}
TD {
border-width: 1;
border-color: #3399ff;
border-style: solid;
}
TH {
border-width: 1;
background-color: #3399ff;
border-color: #3399ff;
border-style: solid;
-->
</STYLE>
*Google Chromeに関するTips [#tf10d4da]
-Google Chrome Frame - IEの中でChromeエンジンを使ってレン...
--妙なソフトをインストールしたくない
--でも、特定のページでHTML5を無理矢理動かしたい(Windows ...
--そんなときはGoogle Chrome Frame
-ダウンロード(インストール)
--http://code.google.com/intl/ja/chrome/chromeframe/
--MSIパッケージ http://www.google.com/chromeframe/eula.ht...
-強制レンダリング
--Chrome Frameをインストールしても通常はIEエンジンで動作...
--特定のページだけChrome Frameでレンダリングさせるには
<meta http-equiv="X-UA-Compatible" content="chrome=1">
*Javascriptに関するTips [#sbf13406]
-ページを表示したら自動的にテキストボックスにフォーカスが...
--googleとか、表示したらすぐに検索キーワードの入力ができ...
<body onload="document.focusform.keyword.focus()">
<form action="test.cgi" method="post" name="focusform">
<input type="text" name="keyword" value="">
<input type="submit" name="" value="送信">
</form>
</body>
--formにnameを定義
--フォーカスを当てたいオブジェクトにnameを定義
--body onloadにdocument.(formのname).(オブジェクトのname)...
*IEの互換モード(レンダリングモード)を強制する [#saa4c75d]
-IEのバージョンによって動いたり動かなかったりするサイトや...
--付け焼き刃だから、これで根本的な対応ではないと何度言え...
-HTML metaタグ
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE...
--他のmetaタグやscriptタグよりも先に書かないと有効になら...
-php
<?php
header('X-UA-Compatible: IE=EmulateIE10');
?>
-htaccess
Header add X-UA-Compatible "IE=EmulateIE10"
-互換モードではなくそのブラウザ自身のバージョンで動作させ...
IE=Edge
*httpのURLでアクセスしてきたらhttpsにジャンプさせる > mod...
-対象のディレクトリの.htaccessに
<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R...
</IfModule>
-参考
--「http://」から「https://」に自動転送させる方法 - ヘテ...
---http://blog.heteml.jp/?p=4152
*画面の上下中央にdivを置くCSS [#d177ef6f]
html {
height: 100%;
}
body {
margin: 0;
padding: 0;
height: 100%;
position: relative;
min-wigth: 600px;
min-height: 400px;
background-color: WHITE;
}
div.centerbox {
margin: -240px 0 0 -325px; //divの大きさの半分をマイナ...
width: 650px; //divの大きさ
height: 480px; //divの大きさ
top: 50%;
left: 50%;
position: absolute;
background-color: transparent;
}
*スマホなどでそこそこ見栄え良く幅を設定する [#a87c1c59]
-headセクションに
<meta name="viewport" content="width=device-width,initia...
*.htaccess記述関係 [#p3406497]
-ディレクトリ一覧表示
--する
Options Indexes
--しない
Options -Indexes
-アクセス制御(Apache2.2と2.4では記述方法が変わった)
--全拒否・一部許可
# Apache 2.4
<ifModule mod_authz_core.c>
Require all denied # 全拒否
Require ip 192.168. # IPベース許可
Require host .jamfunk.jp # ホストベース許可
</ifModule>
# Apache 2.2
<ifModule !mod_authz_core.c>
Order deny,allow
deny from all
Allow from 192.168.
Allow from .jamfunk.jp
</ifModule>
--全許可・一部拒否
# line below if for Apache 2.4
<ifModule mod_authz_core.c>
Require all granted
Require not ip 192.168. # 一部拒否
</ifModule>
# line below if for Apache 2.2
<ifModule !mod_authz_core.c>
Order allow,deny
Allow from all
Deny from 192.168. # 一部拒否
</ifModule>
-httpからhttpsへ転送
RewriteEngine on
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R...
終了行:
#contents
*テンプレ [#s1478639]
-HTML宣言
--HTML 4.01 Strict DTD
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http:...
---一番正しい(?)HTML 4.01
--HTML 4.01 Transitional DTD
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitiona...
---一部の非推奨属性を認めるHTML 4.01
--HTML 4.01 Frameset DTD
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//E...
---フレームを認めたHTML 4.01
--違い
---個人的には一番正しいらしいStrictを使用することを推奨。
---それぞれ何が違うのかは詳しいサイトにお願いする。
---DOCTYPE宣言 - TAG INDEX~
http://www.tagindex.com/html_tag/basic/doctype.html
-HTML開始
<html lang="ja"> ... </html>
-header
<head> ... </head>
--文字コード
<meta http-equiv="Content-Type" content="text/html; char...
---UTF-8, EUC-JP, Shift_JIS
---JISはWindowsでは使用できなくなりました。
--CSS(外部スタイルシート)推奨
<meta http-equiv="Content-Style-Type" content="text/css">
<link rel="stylesheet" href="http://example.com/example....
--CSS(内部スタイルシート)
<style type="text/css">
<!--
(スタイルシートの記述)
//-->
</style>
--JavaScript
<meta http-equiv="Content-Script-Type" content="text/jav...
<script type="text/javascript" src="http://www.example.c...
--Refresh(自動再読み込み秒数)
---無効
<meta http-equiv="refresh" content="0">
---3秒後にhttp://example.com/hoge/へジャンプする
<meta http-equiv="refresh" content="3;URL=http://example...
---ブラウザの履歴に残る(戻るボタンでこのページに戻れる)...
---恒久的・永続的にジャンプさせるのであれば.htaccessのジ...
---秒数で指定
---0秒で無効
--ページ情報
<meta name="author" content="SUNAGAWA Hiroyuki / すなが...
<meta name="description" content="HTML4.01のテンプレやTi...
<meta name="keywords" content="HTML4.01,テンプレ,Tips">
--検索エンジン制御
<meta name="robots" content="noindex,nofollow">
--favicon(お気に入りやアドレスバーのアイコン)
<link rel="icon" href="http://www.example.com/icon.png" ...
<link rel="icon" href="http://www.example.com/icon.ico" ...
<link rel="shortcut icon" href="http://www.example.com/i...
--ページタイトル
<title>HTMLテンプレート</title>
-body
<body> ... </body>
--onload="" にJavaScriptを含めるとページを表示したと同時...
*HTML に関する Tips [#g18320bf]
-全画面表示を開く
<A href="http://www.google.co.jp/"
onclick="window.open('http://www.google.co.jp/','subw...
全画面
</A>
-TABLEの罫線を実線にし、印刷させる。
<STYLE type="text/css">
<!--
TABLE{
border-color: #3399ff;
border-collapse: collapse;
}
TD {
border-width: 1;
border-color: #3399ff;
border-style: solid;
}
TH {
border-width: 1;
background-color: #3399ff;
border-color: #3399ff;
border-style: solid;
-->
</STYLE>
*Google Chromeに関するTips [#tf10d4da]
-Google Chrome Frame - IEの中でChromeエンジンを使ってレン...
--妙なソフトをインストールしたくない
--でも、特定のページでHTML5を無理矢理動かしたい(Windows ...
--そんなときはGoogle Chrome Frame
-ダウンロード(インストール)
--http://code.google.com/intl/ja/chrome/chromeframe/
--MSIパッケージ http://www.google.com/chromeframe/eula.ht...
-強制レンダリング
--Chrome Frameをインストールしても通常はIEエンジンで動作...
--特定のページだけChrome Frameでレンダリングさせるには
<meta http-equiv="X-UA-Compatible" content="chrome=1">
*Javascriptに関するTips [#sbf13406]
-ページを表示したら自動的にテキストボックスにフォーカスが...
--googleとか、表示したらすぐに検索キーワードの入力ができ...
<body onload="document.focusform.keyword.focus()">
<form action="test.cgi" method="post" name="focusform">
<input type="text" name="keyword" value="">
<input type="submit" name="" value="送信">
</form>
</body>
--formにnameを定義
--フォーカスを当てたいオブジェクトにnameを定義
--body onloadにdocument.(formのname).(オブジェクトのname)...
*IEの互換モード(レンダリングモード)を強制する [#saa4c75d]
-IEのバージョンによって動いたり動かなかったりするサイトや...
--付け焼き刃だから、これで根本的な対応ではないと何度言え...
-HTML metaタグ
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE...
--他のmetaタグやscriptタグよりも先に書かないと有効になら...
-php
<?php
header('X-UA-Compatible: IE=EmulateIE10');
?>
-htaccess
Header add X-UA-Compatible "IE=EmulateIE10"
-互換モードではなくそのブラウザ自身のバージョンで動作させ...
IE=Edge
*httpのURLでアクセスしてきたらhttpsにジャンプさせる > mod...
-対象のディレクトリの.htaccessに
<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R...
</IfModule>
-参考
--「http://」から「https://」に自動転送させる方法 - ヘテ...
---http://blog.heteml.jp/?p=4152
*画面の上下中央にdivを置くCSS [#d177ef6f]
html {
height: 100%;
}
body {
margin: 0;
padding: 0;
height: 100%;
position: relative;
min-wigth: 600px;
min-height: 400px;
background-color: WHITE;
}
div.centerbox {
margin: -240px 0 0 -325px; //divの大きさの半分をマイナ...
width: 650px; //divの大きさ
height: 480px; //divの大きさ
top: 50%;
left: 50%;
position: absolute;
background-color: transparent;
}
*スマホなどでそこそこ見栄え良く幅を設定する [#a87c1c59]
-headセクションに
<meta name="viewport" content="width=device-width,initia...
*.htaccess記述関係 [#p3406497]
-ディレクトリ一覧表示
--する
Options Indexes
--しない
Options -Indexes
-アクセス制御(Apache2.2と2.4では記述方法が変わった)
--全拒否・一部許可
# Apache 2.4
<ifModule mod_authz_core.c>
Require all denied # 全拒否
Require ip 192.168. # IPベース許可
Require host .jamfunk.jp # ホストベース許可
</ifModule>
# Apache 2.2
<ifModule !mod_authz_core.c>
Order deny,allow
deny from all
Allow from 192.168.
Allow from .jamfunk.jp
</ifModule>
--全許可・一部拒否
# line below if for Apache 2.4
<ifModule mod_authz_core.c>
Require all granted
Require not ip 192.168. # 一部拒否
</ifModule>
# line below if for Apache 2.2
<ifModule !mod_authz_core.c>
Order allow,deny
Allow from all
Deny from 192.168. # 一部拒否
</ifModule>
-httpからhttpsへ転送
RewriteEngine on
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R...
ページ名: