サンプルページ　　　 文字サイズ固定
 XML/XSL/DHTML/CSS/JAVA　　Java、JavaScript、DHTMLｻﾝﾌﾟﾙ　　　　作成：hogehoge　2025/02/25 14:03
　
任意のﾃｷｽﾄ 　　見出し31　へ   見出し32　へ   見出し33　へ　…　…… ……　…… ……　……　　
任意のﾃｷｽﾄ 　　…… ……　…… ……　…… ……　…… ……　…… ……　……
xml/xsl/DHTML/css/Java

21　ここに、ﾀｲﾄﾙなどを記述するじゃ…*。　　　CSSﾘﾌｧﾚﾝｽ - ここに説明文を記述します。

　

　22　ここに、ｻﾌﾞﾀｲﾄﾙなどを記述しますだよ。 新しいﾍﾟｰｼﾞ０e - ここに説明文を記述します。

　

　

　

　31　　　　ここに、見出しなどを記述しますだよ〜*。　　このページのトップへ       

任意のﾃｷｽﾄ ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… 　

……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　

……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　

……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　

……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　

……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　

　

　

　

　32　　　　ここに、見出しなどを記述しますだよ〜*。　　このページのトップへ       

任意のﾃｷｽﾄ ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… 　

……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　

……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　

……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　

……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　

……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　

　

　

　

　32　　　　ここに、見出しなどを記述しますだよ〜*。　　このページのトップへ       

任意のﾃｷｽﾄ ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… 　

……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　

……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　

……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　

……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　

……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　

　

　

　

　

　

© 2002 hogehoge　 All rights reserved.

　

　

　

ﾎｰﾑ　へ　　　　　　　ｻﾝﾌﾟﾙﾍﾟｰｼﾞ　　文字ｻｲｽﾞ固定　　css_div01.htm

ﾍﾟｰｼﾞ全体とﾀｲﾄﾙや見出しの、文字ｻｲｽﾞ、ﾌｫﾝﾄの指定。　　　ﾌﾞﾗｳｻﾞの、[表示]-[文字ｻｲｽﾞ]-[最大] で変更してもｻｲｽﾞを一定に保つ。　　　　　　CSS。　　　　 ﾍﾟｰｼﾞ全体や、ﾀｲﾄﾙ、見出しの文字ｻｲｽﾞなどのｶｽﾀﾏｲｽﾞはﾃｷｽﾄｴﾃﾞｨﾀｰなどで可。　　　　all 対応。　　　　ｺﾋﾟｰ、編集し、簡単にWebで応用できまっ、(^ ^)。　　　

関連・詳細情報 ：CSS-Measurement and Location Sample、CSS-Measuring Element Dimension and Location

ﾃﾞﾓは、　【Internet Explorer】-[表示]-[文字ｻｲｽﾞ]-[最大] などで。

　

< ご使用方法 >

　・　保存は css_div01.htm、uparrow.gif、download2.gif、wttec.gif を右ｸﾘｯｸ、【名前を付けてﾘﾝｸを保存】 - <保存する場所>： ……、などで。　　※:　変わってしまった、ﾌｧｲﾙ名や、*.htm 中のﾊﾟｽは要修正。

　・　ﾍﾟｰｽﾄは、css_div01.htm をﾃｷｽﾄｴﾃﾞｨﾀｰで開き、ﾎｰﾑﾍﾟｰｼﾞ作成ｿﾌﾄなどの ”ﾃｷｽﾄﾓｰﾄﾞ で、新しいﾍﾟｰｼﾞや hogehoge.htm（=任意の挿入先ﾌｧｲﾙ名） の、 <head>　〜　</head> の任意の行間に (*1) を、さらに <body>　〜　</body>の任意の行間に (*2) をﾍﾟｰｽﾄします。　　　※: ﾃｷｽﾄﾓｰﾄﾞ :  ｺｰﾄﾞ/HTMLﾀｸﾞ挿入/HTMLﾒﾆｭｰ など。

　･　編集 : hogehoge.htm に ﾃｷｽﾄﾓｰﾄﾞでﾍﾟｰｽﾄ 後は、ﾎｰﾑﾍﾟｰｼﾞ作成ｿﾌﾄのﾃﾞｻﾞｲﾝや通常ﾓｰﾄﾞ、ﾃｷｽﾄﾓｰﾄﾞ、ﾃｷｽﾄｴﾃﾞｨﾀｰで編集します。　　下記の（例） (*1) と、(*2)  を参考に太字部分の編集を任意に行います。　

※: 外部ﾄﾞﾒｲﾝ（ｻｲﾄ）にｱｯﾌﾟﾛｰﾄの画像などの使用は、非表示に注意。　　画像の alt ﾀｸﾞは不可、ｻｲｽﾞ指定の pt などの省略は注意。　　ｽｸﾘﾌﾟﾄ構文中への 改行混入注意。

　･　ｱｯﾌﾟﾛｰﾄﾞは、hogehoge.htm と同じﾎﾙﾀﾞｰに、使用してる 上記画像、*.js、*.css などがあればｱｯﾌﾟﾛｰﾄﾞします。 　　別ﾎﾙﾀﾞｰの場合は、hogehoge.htm の該当ﾊﾟｽ注意。

　・　作動ﾃｽﾄは Edge〜 などで。　　更新の確認は、ﾌﾞﾗｳｻﾞｰなどのｷｬｯｼｭのｸﾘｱ後に実施。　　(1) [F5]ｷ- or Ctrl+Rｷｰ を押し、最新ﾃﾞｰﾀ読み込みで。　　更に、(2) Edgeを全て閉じ、再起動を行い、【Edge】 - 右上 [……] - [設定] - [ﾌﾟﾗｲﾊﾞｼｰ、検索、ｻｰﾋﾞｽ] - [閲覧ﾃﾞ-ﾀをｸﾘｱ] - ［ｸﾘｱ-するﾃﾞ-ﾀの選択］ - ［ｖ］閲覧の履歴 -［今すくｸﾘｱ］ をｸﾘｯｸ。　　留めに、(3) ｻｰﾊﾞｰのﾌｧｲﾙを一旦削除。

　･　関連情報 ： 色記号 、RGB5　〃6 、〃8 、ﾌｫﾝﾄ、ｽﾀｲﾙｼｰﾄﾘﾌｧﾚﾝｽ、ﾎｰﾑﾍﾟｰｼﾞ開設入門、HTMLをﾃｷｽﾄｴｷﾞﾀ-で編集。

　

(*1) ：　css_div01.htm （例）　　　　　　　　　挿入先の 　<head> 〜 </head>の、〜部分にﾍﾟｰｽﾄします。

HTMLの編集方法　  (*1) をﾃｷｽﾄｴﾃﾞｨﾀｰで開き、下記↓のHTMLを挿入先ﾌｧｲﾙにﾍﾟｰｽﾄ、太字部分を編集し使用。
〔この列ﾍﾟｰｽﾄ不要〕

ｼﾌﾄJIS使用（削除不可）

ｉｅなどに表示するｱｲｺﾝﾌｧｲﾙ名（削除可）

<style type= 〜  </style>は（削除可）
(*1)〜(*3)表ﾀｲﾄﾙ背景
body 文字色　背景色 画像　下線
ﾊｲﾊﾟｰﾘﾝｸ 〃
表示済みの〃
ﾏｳｽｵｰﾊﾞｰ時の〃
ｸﾘｯｸ中の〃
ﾌｫﾝﾄ

ﾘﾝｸを新しいWinで開くを標準（削除可）※：target=　いろいろ
同じﾌﾚｰﾑ=_self、ﾍﾟｰｼﾞ全体=_top、親ﾌﾚｰﾑ=_parent

お気に入りなどに表示 : ﾍﾟｰｼﾞ名（≠ﾌｧｲﾙ名）定

headline　　〃

　

instructions　　〃

group　　〃

button　　〃

arrow　　〃

midasi1　　〃

midasi2　　〃

midasi3　　〃

 		　

<meta http-equiv="Content-Type" content="text/html; charset=x-sjis">

<link REL="SHORTCUT ICON" href="favicon.ico">

<style type="text/css"><!--
.xxx0 { background: #F9F8F9 url('wttec.gif'); }
.xxx1 { background-color:#E3E0DC; }
.xxx2 { background-color:#FFFFFF; }
body { color:#000000; background: #F9F8F9 url('wttec.gif'); text-decoration:none }
a:link { color:#190049; background-color:#FBFAFE; text-decoration:none; }
a:visited { color:#333; background-color:#EDECEF; text-decoration:none; }
a:hover { color:#1F002E; background-color:#D3FE7C; text-decoration:underline; }
a:active { color:#1F002E; background-color:#C3FEBB; text-decoration:underline; }
font {font-size:12px; line-height:13px;}
body,tr,td,form{ font-family:メイリオ.Lucida Sans Regular,MS PGothic,; font-size: 12px}
 --></style>

<base target="_blank">

<title>サンプルページ　　文字サイズ固定</title>

　

<style type="text/css"><!--

.headline { background-color:#B3ABBF; color: #E9FF54; font-family:MSP Gothic,MS Gothic; font-size:16pt; text-align:center; padding-top:0.5em; padding-bottom:0.5em; }

.instructions { font-style:italic; text-align:right; color:gray; margin-left:.5em; }

.group { font-family:Arial Unicode MS,Arial,Terminal; font-size:10pt; font-weight:bold ;margin-top:.5em; margin-left:.5em; margin-bottom:0.5em; }

.button { font-family:MSP Gothic,MS Gothic; font-size:10pt; font-weight:bold; text-align:right; color:gray; cursor:hand; }

.arrow { font-family:Webdings; }

.midasi1 { background-color:#877B7F; font-family:MSP Gothic,MS Gothic; font-size:12pt; font-weight:bold; margin:0px; color:#CBAEEB; text-align:left; padding-top:9px; padding-bottom:4px; margin-left:4pt ;}

.midasi2 { background-color:#99907B; font-family:MSP Gothic,MS Gothic; font-size:12pt; font-weight:bold; margin:0px; color:#FDF6F9; text-align:left; padding-top:6px; padding-bottom:4px; margin-left:4pt ;}

.midasi3 { background-color:#E3E0DC; font-family:MSP Gothic,MS Gothic; font-size:11pt; font-weight:bold; margin:0px; color:#5C2974; text-align:left; padding-top:3px; padding-bottom:3px;}


 --></style>

　

(*2) ：　css_div01.htm （例）　　　　　　　　挿入先の 　<body> 〜 </body>　の、〜 部分にﾍﾟｰｽﾄします。

HTMLの編集方法　  (*2)をﾃｷｽﾄｴﾃﾞｨﾀｰで開き、下記↓のHTMLを挿入先ﾌｧｲﾙにﾍﾟｰｽﾄ、太字部分を編集し使用。
〔この列ﾍﾟｰｽﾄ不要〕

　

　

ﾃｷｽﾄ　吹き出し　URL

　

　

　

　

　

 		　

<body

　

<DIV CLASS="headline"><b> &nbsp;XML/XSL/DHTML/CSS/JAVA</b>　<span style="font-weight: 400"><font SIZE="2"><a title="最新版の保存:右ｸﾘｯｸ → 対象をﾌｧｲﾙに保存で。" href="http://xml-xsl.sakura.ne.jp/oritatami3c.html">Java、JavaScript、DHTMLｻﾝﾌﾟﾙ</a>　<!--webbot bot="HTMLMarkup" startspan --><img border="0" src="download2.gif" width="14" height="16" onclick="execCommand('SaveAs');" title="ｸﾘｯｸ → このﾌｧｲﾙに名前を付けて保存できます。"><!--webbot bot="HTMLMarkup" endspan i-checksum="39469" -->　　<font color="#CCCCCC">作成：hogehoge</font><font color="#CCDDDD">　<!--webbot bot="Timestamp" S-Type="REGENERATED" S-Format="%Y/%m/%d %H:%M" startspan -->2002/08/09 15:44<!--webbot bot="Timestamp" endspan i-checksum="25996" --></font></font></span></DIV> </DIV>

<DIV CLASS="instructions">

任意のﾃｷｽﾄ 　　<a target="_self" href="#i1">見出し31　へ</a>&nbsp;&nbsp;

<a target="_self" href="#i2">見出し32　へ</a>&nbsp;&nbsp;

<a target="_self" href="#i3">見出し33　へ</a>　…　…… ……　…… ……　……　　

</DIV>

<DIV CLASS="instructions">

任意のﾃｷｽﾄ 　　…… ……　…… ……　…… ……　…… ……　…… ……　……

</DIV>

<DIV CLASS="group">xml/xsl/DHTML/css/Java

<DIV CLASS="button" ID="xml/xsl/DHTML/css/Java">

<a href="http://xml-xsl.sakura.ne.jp/random_message2.hta" target="_blank" title="HTML Applications (HTA)実験">ﾗﾝﾀﾞﾑﾒｯｾｰｼﾞ2 - HTA</a><SPAN CLASS="arrow">4</SPAN>

</DIV>

</DIV>

<p>

<DIV CLASS="midasi1">

<font color="#970CFE">　</font>21　ここに、ﾀｲﾄﾙなどを記述するじゃ…*。　　<a href="http://xml-xsl.sakura.ne.jp/css.htm" target="_blank" title="ｽﾀｲﾙｼｰﾄのﾀｸﾞのﾘﾌｧﾚﾝｽ-機能索引"><font face="ＭＳ Ｐゴシック" size="2">CSSﾘﾌｧﾚﾝｽ</font></a><font face="ＭＳ Ｐゴシック">

　<font color="#FFFFFF"><span style="font-weight: 400"> - ここに説明文を記述します。</span></font></font></DIV>

<DIV CLASS="midasi2">

　22　ここに、ｻﾌﾞﾀｲﾄﾙなどを記述しますだよ。 <font face="ＭＳ Ｐゴシック" size="2">

<a target="_blank" title="ｽﾀｲﾙｼｰﾄのﾀｸﾞのﾘﾌｧﾚﾝｽ-機能索引" href="http://xml-xsl.sakura.ne.jp/data_bind.htm">

DataBind</a></font><font face="ＭＳ Ｐゴシック">

　<font color="#FFFFFF"><span style="font-weight: 400"> - ここに説明文を記述します。</span></font></font></DIV>

<p>　</p>

<table border="1" cellspacing="0" width="100%" bordercolorlight="#FFFFFF" bordercolordark="#C7BECD" style="border-collapse: collapse" bordercolor="#111111" cellpadding="0">

<tr>

<td width="100%" bgcolor="#FFFFFF">

<DIV CLASS="midasi3">

<a name="i1"></a><span style="background-color: #E3E0DC"><strong>

<font size="2">　<font color="#76499A">31　　　ここに、見出しなどを記述しますだよ〜*。</font></font>　　</strong></span><a href="#top" target="_self"><img src="./uparrow.gif" border="0" alt="このページのトップへ" width="100" height="11">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>

</DIV>

</td>

</tr>

</table>

<p>任意のﾃｷｽﾄ ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… 　</p>

<p> ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　</p>

<p> ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　</p>

<p> ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　</p>

<p> ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　</p>

<p> ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　</p>

<p>　</p>

<table border="1" cellspacing="0" width="100%" bordercolorlight="#FFFFFF" bordercolordark="#C7BECD" style="border-collapse: collapse" bordercolor="#111111" cellpadding="0">

<tr>

<td width="100%" bgcolor="#FFFFFF">

<DIV CLASS="midasi3">

<a name="i2"></a><span style="background-color: #E3E0DC"><strong>

<font size="3">　<font color="#76499A">32　　　　ここに、見出しなどを記述しますだよ〜*。</font></font>　　</strong></span><a href="#top" target="_self"><img src="./uparrow.gif" border="0" alt="このページのトップへ" width="100" height="11">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>

</DIV>

</td>

</tr>

</table>

<p>任意のﾃｷｽﾄ ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… 　</p>

<p> ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　</p>

<p> ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　</p>

<p> ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　</p>

<p> ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　</p>

<p> ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　</p>

<p>　</p>

<table border="1" cellspacing="0" width="100%" bordercolorlight="#FFFFFF" bordercolordark="#C7BECD" style="border-collapse: collapse" bordercolor="#111111" cellpadding="0">

<tr>

<td width="100%" bgcolor="#FFFFFF">

<DIV CLASS="midasi3">

<a name="i3"></a><span style="background-color: #E3E0DC"><strong>

<font size="3">　<font color="#76499A">33　　　　ここに、見出しなどを記述しますだよ〜*。</font></font>　　</strong></span><a href="#top" target="_self"><img src="./uparrow.gif" border="0" alt="このページのトップへ" width="100" height="11">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>

</DIV>

</td>

</tr>

</table>

<p>任意のﾃｷｽﾄ ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… 　</p>

<p> ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　</p>

<p> ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　</p>

<p> ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　</p>

<p> ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　</p>

<p> ……　……　 ……　…… ……　…… ……　…… ……　…… ……　…… ……　……　</p>

<p>　</p>

<P><HR color="#000000" size="0"><font color="black" face="MS UI Gothic" size="2">&copy;<a href="http://www./……/xxx.html" target="_top"> 2002 hogehoge All rights reserved.</a></font><font face="MS UI Gothic">

</font>