- ベストアンサー
テーブルの中で文字に影をつけることは可能でしょうか？
こんにちは。 上記のタイトルを質問させて頂きます。 テーブルを作ってその中の文字に影をつけることは可能でしょうか？ ここでいう影とは、スタイルシートで使うabsoluteで重ねる影でも何でもいいので、とりあえず普通の文字と変化をつけたい影です。 自分で色々調べて、rerativeとabsoluteの２通りで試したのですが、無理でした・・・。 具体的には、 rerativeで影をつけようと文字を重ねようとすると、段落になり、重ならないです。 また、 abosoluteで影をつけようと文字を重ねようとすると、テーブルから外れてしまい、失敗です。topやleftなどで、無理やり合わせてしまうと、ブラウザのウインドウを小さくしたときに、シルエットが変わってしまい、ダメです。 あと、Javaスクリプトなど、セキュリティーがうるさいのは使いたくないので、どうにかなりませんでしょうか？
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
その他の回答 (2)
- yambejp
- ベストアンサー率51% (3827/7415)
実際にやっていないので偉そうなことはいえないのですが。 とりあえずあなたがお書きになった内容を書き出してみてはいかがでしょう。そうすると問題点がわかるかと。
補足
それもそうですね！ <html> <head> <title>a</title> </head> <body> <table border="" cellspacing="" cellpadding="" align="center" width="600" height="100" bordercolor="orange" bgcolor="" background=""> <tr> <td> <DIV align="center" style="position:absolute; top:13px; left:2px; z-index:3"> <font size="6" color=""><B>あいうえお</B></font><BR> </DIV> <DIV align="center" style="position:absolute; top:15px; left:0px; z-index:4"> <font size="6" color="yellow"><B>あいうえお</B></font><BR> </DIV> </td> </tr> </table> </body> </heml> お願いします。
関連するQ&A
- TABLE内の、文字の大きさの設定
スタイルシートで文字の大きさを指定しているのですが、 こんなの↓ body {font-size:10pt;} table {font-size:10pt;} td {font-size:10pt;} th {font-size:10pt;} まず、テーブル内もBODY内も指定どおりに文字の大きさは変わるのですが、 このあと、ブラウザの文字の大きさを、 最小、小、中、大、最大と変化させても、 BODY内は正しく変わりますが、 テーブル内は全く変化無しです。 ＩＥでのみ検査してますが、 テーブルについても、BODY内と同じように、 文字の大きさが可変になるような設定方法を知りませんか？
- 締切済み
- HTML
- innerTextで文字を変えたいのですが
配列imに入っている数値が1なら"ok"と表示、0なら"-----"と表示したいのです。 以下のソースなのですが <html> <head> <style type=text/css> .im{ font-size:1.5em; font-weight:500; color:#ffffff; text-dacoration:none; text-decoration:blink; z-index:3; } </style> <script langage="JScript"> var im=new Array(30); var haba=0; //初期設定 function Preferences(){ for(i=1;i<=30;i++){ obj=document.getElementById("num"+i); obj.style.posTop+=haba; haba+=25; } for(f=1;f<=30;f++){ im[f]=0; im[2]=1; im[5]=1; if(im[f]==0){ num="num"+f; num.innerText="----------"; }else{num.innerText="ok";} } } </script> </head> <body bgcolor="#0000000" onLoad="Preferences()"> <div id="num1" class="im" style="position:absolute;top:25px;left:240px;">A1</div> <div id="num2" class="im" style="position:absolute;top:25px;left:240px;">A2</div> <div id="num3" class="im" style="position:absolute;top:25px;left:240px;">A3</div> <div id="num4" class="im" style="position:absolute;top:25px;left:240px;">A4</div> <div id="num5" class="im" style="position:absolute;top:25px;left:240px;">A5</div> <div id="num6" class="im" style="position:absolute;top:25px;left:240px;">A6</div> <div id="num7" class="im" style="position:absolute;top:25px;left:240px;">A7</div> <div id="num8" class="im" style="position:absolute;top:25px;left:240px;">A8</div> <div id="num9" class="im" style="position:absolute;top:25px;left:240px;">A9</div> <div id="num10" class="im" style="position:absolute;top:25px;left:240px;">A10</div> <div id="num11" class="im" style="position:absolute;top:25px;left:240px;">A11</div> <div id="num12" class="im" style="position:absolute;top:25px;left:240px;">A12</div> <div id="num13" class="im" style="position:absolute;top:25px;left:240px;">A13</div> <div id="num14" class="im" style="position:absolute;top:25px;left:240px;">A14</div> <div id="num15" class="im" style="position:absolute;top:25px;left:240px;">A15</div> <div id="num16" class="im" style="position:absolute;top:25px;left:240px;">A16</div> <div id="num17" class="im" style="position:absolute;top:25px;left:240px;">A17</div> <div id="num18" class="im" style="position:absolute;top:25px;left:240px;">A18</div> <div id="num19" class="im" style="position:absolute;top:25px;left:240px;">A19</div> <div id="num20" class="im" style="position:absolute;top:25px;left:240px;">A20</div> <div id="num21" class="im" style="position:absolute;top:25px;left:240px;">A21</div> <div id="num22" class="im" style="position:absolute;top:25px;left:240px;">A22</div> <div id="num23" class="im" style="position:absolute;top:25px;left:240px;">A23</div> <div id="num24" class="im" style="position:absolute;top:25px;left:240px;">A24</div> <div id="num25" class="im" style="position:absolute;top:25px;left:240px;">A25</div> <div id="num26" class="im" style="position:absolute;top:25px;left:240px;">A26</div> <div id="num27" class="im" style="position:absolute;top:25px;left:240px;">A27</div> <div id="num28" class="im" style="position:absolute;top:25px;left:240px;">A28</div> <div id="num29" class="im" style="position:absolute;top:25px;left:240px;">A29</div> <div id="num30" class="im" style="position:absolute;top:25px;left:240px;">A30</div> </body> </html> innrTextで表示する文字を変えるところがおかしいんだと思いますがどう直せばいいのか分かりません。 どなたか教えてください。
- ベストアンサー
- JavaScript
- マウスオーバーでテーブル表示
タイトル通りのことがしたくて、以下のようにしてみたのですが、表示されません。 どこがダメなのか教えてください。 （マウスオーバーで画像表示、はできるようになったんですが。。。） <script language="JavaScript"> function table(object,hyoji){ document.[object].style.visibility=hyoji } </script> <img src="onMouseOver('TABLE1','visible');"> <SPAN STYLE="POSITION:ABSOLUTE; TOP:30; LEFT:40; filter: Alpha(opacity=60); visibility='hidden';"> <TABLE CLASS="SETSUMEI" NAME="TABLE1"> <TR><TD CLASS="SETSUMEI">TOPページに<BR>戻ります。</TD></TR></TABLE></SPAN> テーブルって名前つけられたんだっけ…？とかいろいろ不安なところはありますが、 よろしくお願いします。
- ベストアンサー
- JavaScript
- タグに関する質問（文字に影をつける）
リンク付きの文字に影をつけたのですが、文字の抜けている部分が押せなくなってしまいました。 えっと、かなりわかりづらいですよね； 例えば「十」という文字を □□■□□ □□■□□ ■■■■■ □□■□□ □□■□□ と現すと、通常なら□の部分も■の部分も押せますよね？ でも影をつけると□の部分は押せなくなってしまうんです； 解決策はあるでしょうか？ タグは <P style="WIDTH:100%;FILTER:Shadow(color=#335588,direction=120)"> <A href="a.htm">りんく</A> </P> といった感じです。 それと、同じ質問に入れるか迷ったのですがテーブルの外枠だけを半透明にする方法もあったらお願いします；
- ベストアンサー
- HTML
- スタイルシートで位置指定したときに表示が乱れる環境
スタイルシートで位置指定したときに、うまく表示がされない環境について教えてください。 ホームページの中で、部分的に次のような書き方をして位置指定しています。 <SPAN STYLE="position: absolute; top: 40px; left: 10px">～</SPAN> このタグを <BODY> aaaaaaa <BR><BR><BR> <SPAN STYLE="position: absolute; top: 40px; left: 10px">～</SPAN> bbbbbbbbbbbbb <BR>cccccccc </BODY> このような書き方で<BR>タグでスペースを空け、そこに位置指定がくるようにしています。 実際にはテーブルとかフォームのタグ、Javascriptも併用したページになっています。 私の環境のWin98、IE6.0では問題なく表示されているのですが、表示が崩れる環境には具体的にどんなものが有るのでしょうか。OSによる影響、ブラウザーによる影響等個別にわかればお教えください。
- 締切済み
- HTML
- 影付き文字の表示
スタイルシートで <span style="width:100%;filter:blur(add=1,direction=135,strength=20)"> <FONT SIZE="6" COLOR="blue"><B>サンプル</B></FONT></span> のように作成した「サンプル」の文字が以前は影が表示出きていたのに最近表示出きません又、 <div style="width:100%; filter:shadow(color=#666666,direction=135)"> <IMG SRC="images/***.Jpg" ALT="***" WIDTH="240" HEIGHT="180" BORDER="0"></div> で写真に影を付けていたのですが同じように最近は表示出来ません。 何が原因なのでしょうか？ 教えて下さい。
- 締切済み
- その他（インターネット・Webサービス）
- テーブル内のスタイルシートについて。
カテゴリHTMLでよいのか、ちょっとビクビクしているのですが。 テーブルのひとつのセル内で左揃えの文字列と右揃えの文字列を作りたいのです。 スタイルシートを使おうと思ったのですが、 それぞれの文字列に <SPAN STYLE="text-align:left;">むにゃむにゃ</SPAN> <SPAN STYLE="text-align:right;">うにょうにょ</SPAN> と指定をしても全く反映されません。 一つのセル内で左右に文字を振ることは不可能なのでしょうか？
- ベストアンサー
- HTML
- スタイルシートについて
スタイルシートについてお尋ねしたいのですが・・・。 下記のようにしてスタイルシートを使用したいのです。 ↓ <table style="position:absolute;top:140;left:170"> スタイルシートはIEのバージョンによって、使えたり使えなかったりするのでしょうか？ 私が使用しているIEのバージョンがIE5.5で、同じプログラムをIE6.0で 動作させるとstyleが効いていたり効いていなかったりするのです。 何かわかる方がいらっしゃれば、ご指導ください。
- ベストアンサー
- HTML
- スタイルシートで位置固定すると、スタイルシートでの改ページ指定ができなくなる
スタイルシートのpositionを使用して位置固定すると、page-break-beforでの 改ページができなくなります。 位置固定し、かつ、その文字の直前で改ページする方法はないでしょうか？ ブラウザはIE5.5以降を考えてます。 ====================================================================== <html> <body> <div style="position:absolute; top:100px;"> テスト１ </div> <div style="position:absolute; top:150px; page-break-before:always;"> テスト２(この文字の直前で改ページさせたい） </div> <div style="position:absolute; top:200px;"> テスト３ </div> </body> </html> ====================================================================== 宜しくお願いします。
- ベストアンサー
- HTML
- スタイルシートを組むと、テーブルのセルの幅が広くなってしまいます。
ソフトは DREAMWEAVERを使用しています。 スタイルシートを指定した瞬間、テーブルの幅が広くなって、テーブル幅を指定しても変化がありません。 せめて広くなったテーブルの真中に文字をもってきたいのですが、どうすればよいのでしょか？
- ベストアンサー
- HTML
お礼
そうなんですか！ 敬遠されていたのか・・・。 全然しらなっかったです！ ありがとうございます！ これも結構良い影文字ですね！