• ベストアンサー

あかさたな・・・順でタイトルを表形式に管理したい 

以下のようなことを考えております。何か良い方法はございませんでしょうか。 htmlエディタでの作成を想定しております。Dreamweaverでも可。 4列の表で、ア行(あいうえお)のタイトルを掲載。 ただし、更新時に"あ"のタイトルを追加しようとするとき、”い”行以下を自動的にうしろのセルに移行したいのです。 列は、4列で固定。行は増えて構わない。 例えば、一列でデータを作っていき、表示させるときは、4列にできればよいと考えたのですが、そのようなCSSは可能なのでしょうか。

質問者が選んだベストアンサー

  • ベストアンサー
  • DrFell
  • ベストアンサー率55% (305/551)
回答No.2

それは表ではない気がします。 縦と横の交わりに意味はなさそうですので、ただ単に、段落だとしたら、3段で <html> <head> <style>p{width:33%;height:2em;float:left;}</style> </head> <body> <p>テキスト1</p> <p>テキスト2</p> <p>テキスト3</p> <p>テキスト4</p> <p>テキスト5</p> <p>テキスト6</p> <p>テキスト7</p> <p>テキスト8</p> <p>テキスト9</p> <p>テキスト10</p> <p>テキスト11</p> </body> </html> もともとの質問の4段なら、<style>の中のwidth:33%をwidth:24%に変えてください。 また、段落ではなくリストなら、<ul><li></li></ul>で組まれて、<style>の中のpをulに変えてください。 Dreamweaver使うのははやすぎると思われます。手打ちでhtmlやcssの基本や考え方を身につけてから、Dreamweaverを使われることをお勧めします。まずはどんな意味がテキスト#にあるのかを考えてマークアップされることです。

tomo0117
質問者

補足

ありがとうございます。深謝!! うまくいきました。 そこで、大変勝手なのですが、こんかい行っておりますのでは、 あるタイトルを入れるページで、あかさたな順にページを作っているのです。 そこで、タイトルにボーダーを入れたくなり、下記CSSを作成して <div class="title-hight"> </div> で<p>タグを囲みました。 #abcd .title-hight { height:650px; border-top:1px solid #888; border-right:1px solid #888; } #abcd p { width:24%; height:4em; float:left; border-left:1px solid #888; border-bottom:1px solid #888; padding:5px 0 0 5px; } #abcd p a { text-decoration:underline; } ほぼうまくいったのですが、 ら行など、数が少ないところは、 <div class="title-hight" style="height: 150px;"> として、height を短くしたのです。 そうしたところ、一番右側の横ボーダーに関して、4px隙間が出てしまうのです。 また、高さも微調整が難しいのですが、こちらは各ヤ行 マ行など調整していくしか無いとは思っております。 右側のボーダーに関して対応はありますでしょうか。

その他の回答 (1)

  • violet430
  • ベストアンサー率36% (27472/75001)
回答No.1

Windowsでは五十音順というソートはできません。文字コード順になってしまいます。 そのため、五十音順にみせるには、ふりがなの項目を作成してふりがなをキーにしてソートする必要があります。Excelのような表計算ソフトなら容易にできますね。

tomo0117
質問者

補足

回答ありがとうございます。 ふりがな項目は、難しいのです。 私の説明が悪かったかもしれないのですが、以下のように 1列で表示していたところを3列に変更したい。 目的は、後から挿入しても3列できちんと並ぶようにずれて 表示させたいので。 "あ行"の中に入力しているデータで、あいうえおのデータが 入っているが、"あ"のデータを追加すると、それ以降を 1つづつずらして表示したいため。 <td><p>テキスト1</td></p> <td><p>テキスト2</td></p> <td><p>テキスト3</td></p> <td><p>テキスト4</td></p> <td><p>テキスト5</td></p> <td><p>テキスト6</td></p> のように入力したデータをCSSを利用して <table> <tr> <td> <p>テキスト1</p> </td> <td> <p>テキスト2</p> </td> <td> <p>テキスト3</p> </td> </tr> <tr> <td> <p>テキスト4</p> </td> <td> <p>テキスト5</p> </td> <td> <p>テキスト6</p> </td> </tr> </table>

関連するQ&A

  • エクセルで管理表を作りたい

    20枚程になる機械の一覧表を作成したのですが、各ページの表の一行目に機械名や日付などの項目のタイトルを入れて、一列目には機械の横に1から20まで番号を付けます。追加や削除があったときに簡単に一行削除や行追加ですむように各ページの一行目、一列目に常に同じ内容を印刷するにはどうすればいいんでしょうか? 一行目はページ設定の中の印刷タイトルを使ったんですが、列の方がよくわかりません。いい方法があれば教えてくださいよろしくお願いします。

  • ワード2000使用:表操作のマクロ化

    ワード2000使用 5行5列(A列からE列と呼ぶ)の表あり。最上部タイトル行 次の操作をマクロで表現したい。 操作:タイトル行の下行から。B列のセルに文字がないときA列のセルも文字を消す。 以上宜しくお願いします。

  • 斜め罫線に、行タイトル、列タイトルを入れるには、

    こんにちは、表作成時、列タイトルと行タイトルが交わるところ(表の左上に当たるところ)のセルに斜め罫線を引いて、上には列タイトル、下には行タイトルを入れたいのですが、どうやったらよろしいでしょうか。

  • Excel表検索の手立てについて

    Excel2010で、以下のような表があります    A    B   C   D 1  90  80  70  60 2  85  75  65  55 3  80  70  60  50 ここで、セルA5に「行=2」という「位置の変数」と セルA6に「点=70」という「得点の変数」が与えられています。 この値から、「列=B」(得点の直上の値)という結果(列=2という結果でも可) を得たいのですが、うまいこと関数で何とかならないでしょうか? なにせ、上記は例でしかなく、実際の表は縦30×横26なのでIFを並べるわけにも いかないんです。 行が固定ならMATCH関数で簡単にできるんですが・・・。

  • マウスが触ったら表中の1行の背景色変えたい

    一覧表を作成しておりますが、その表のある列を触ったら、その列にあるすべてのセル(1行を選択したかのようなイメージ)の背景色を変えたいのですが、どのようにしたらよいでしょうか。 できればCSSで実現したいのですが、無理ならJavaScriptでも結構です。 宜しくお願いいたします。

  • tableタグで作るような表をCSSで作る方法

    一つのページに表(横:600px、縦:155px)を20~30個くらい表示させたいのですが、tableタグを多用するとページが重くなると聞きました。 そこで、CSSを使って表を作ろうと思うのですが、どのように作れば良いのか分かりません。 ご存知でしたら教えてください。 私が作りたい表は下記になります。 XHTML 1.0 Transitional 横幅:600px 縦幅:155px 4行3列で、一番左の列の4行を繋げて(tableタグでの記述は<td rowspan="4">)一つの空間になっているのもの。 セルとセルの間隔は5pxのもの。 HTMLとCSSの記述を教えていただけると幸いです。 よろしくお願いします。

    • ベストアンサー
    • HTML
  • Excel2007で、行の自動色分けについての質問です。

    Excel2007で、行の自動色分けについての質問です。 B1とB2をセルの結合で一行にします。その左A1、A2はそのままにしておきます。これをワンセットとして考えます。つまり一列目は二行、2列目は1行になっているものを一単位として考えるという意味合い。 MOD関数で一行単位で色分けできますが、この一単位を一行と考えて、色分けしようとしても1列目の余りが違うので、一列目は色つきのセル(行)とそうでないセル(行)に別れてしまいますし・・・ なにかいい方法があればお願いします。

  • 縦横スクロール時の固定セルの重ね順について

    http://shinsama1980.web.fc2.com/jishin2303.htm このHPの「令和5年春場所自信一番集計表」の下にある表の上5行と左2列を固定したのですが、 縦方向にスクロールさせると左2列のセルが上5行の部分に行った時に最前面に表示させたい左上の3セルよりも前面に移動されてしまいます。 左2列を縦スクロールさせても左上3セルよりも下に表示されるようにするにはどうすれば良いのでしょうか? P.S 当方はCSSについてはズブの素人ですので、 回答される方はHTMLやCSSをなるべく具体的に書いていただけると幸いです。 何卒宜しくお願い致します。

    • ベストアンサー
    • CSS
  • 範囲の合計が条件を満たす数を数えたい

       A列    B列   C列   D列 1行  5     3 2行 3行       8 4行  6     4    2 5行  3 60行 上記の様な表で同じ行の各セルの数値の合計 が8以上の行の数を数えたいのです。 (A1+B1+C1+D1が8以上かどうかの以下60行目まで繰り返し) 例では3個 一列ならばCOUNTIF($A$1:$A$60,">=8")でOKなのでしょうが‥ 作業列を用いずに出来ないものでしょうか?お助け下さい。

  • エクセル2003 星取表作成

    エクセル2003 星取表作成 エクセルで表を作成していて、この空欄を埋めたらこの想定値が返るというようにしたいです。 想定値の算出は添付のようなイメージです。 この表は横に30列、縦にも40行ほどあります。 このような想定値を簡単に出す方法はありますか? 想定値=表の中の金額の合計÷空白セルの数

専門家に質問してみよう