文字だけでフォルダのツリー構造や表を作成する方法


投稿日:2014年10月13日
  • 5
  • 0



いつもどうやって書いてたっけ?と調べるのでメモ。

keisen

説明のために表やグラフを使いしたい」そんな時も専用のソフトを使えば簡単に作成できるようになりました。
しかしちょっとしたメールや文章にわざわざ画像ファイルを添付するのは面倒なものです。

そういった場合に便利なのが、罫線を使った表現です。


ツリー構造の書き方

ちなみに罫線はすべて「けいせん」と入力して変換すると表示されます。

keisen01

ツリー構造が把握しやすいタイプ

root ―┬― bin
    ├― boot
    ├― usr ―┬― bin
    |     └― etc
    └― var ―┬― account
           └― cache

※.このサイトではシンタックスハイライターで表示しているので多少ずれていますが、テキストエディタにコピーペーストしていただければ綺麗に表示されます。

keisen02

コンパクトで幅を取らないタイプ

root
├bin
├boot
├usr
|├lib
|└etc
└var
  ├account
  └cache

フォルダとファイルの混在

wordpress
├wp-admin
||  about.php
||  admin.php
||  admin-footer.php
|├css
|└images
├wp-content
||   index.php
||   db.php
|├cache
|└themes
└wp-includes

罫線で書く表

こちらも箇条書きにするよりずっと見やすくなります。
ただ大型化すると修正が面倒なので「エクセルの表を文字に変化するツール」を利用すると楽です。

表の基本形

細いタイプ
┌┬┐
├┼┤
└┴┘

細いタイプ
┏┳┓
┣╋┫
┗┻┛

文字を入力する場合

┌────┬────┐
│ 氏名 │生年月日│
├────┼────┤
│  hoge  │  5/30  │
└────┴────┘

二重罫線を使った表

╔═════════╦═════════╗
║  name   ║  D.o.B. ║
╠═════════╬═════════╣
║  hoge   ║  5/30   ║
╠═════════╬═════════╣
║  hoge   ║  5/30   ║
╚═════════╩═════════╝

迷路も作れます

┏↓━━┳━━━━━┓
┃   ┃     ┃
┃ ┃ ┃ ┏━━━┫
┃ ┃   ┃   ┃
┃ ┣━━━┛ ┃ ┃
┃ ┃     ┃ ┃
┃ ┃ ┏━━━┫ ┃
┃ ┃ ┃   ┃ ┃
┃ ┃ ┃ ┃ ┃ ┃
┃   ┃ ┃   ┃
┗━━━┻━┻━━↓┛

こんな感じで応用すれば文字だけで色々な表現ができます。

   〃∩ ∧_∧
   ⊂⌒(  ・ω・)  はいはいべんりべんり
     `ヽ_っ⌒/⌒c
        ⌒ ⌒

現在のページを共有する



現在のページに関連する記事

WordPressをインストールしたら初めに設定する項目 WordPressをインストールしたら初めに設定する項目
文字だけでフォルダのツリー構造や表を作成する方法 WordPressに「トップへ戻る」ボタンを設置して、フックの仕組みについて学ぼう
文字だけでフォルダのツリー構造や表を作成する方法 WordPressでpathやURLを取得するためのタグと出力例まとめ
文字だけでフォルダのツリー構造や表を作成する方法 Googlebotを手懐ける!robots.txtの書き方とrobots.txtテスターの使い方
WordPressにGoogle+、Facebook、Twitterボタンを追加 WordPressにGoogle+、Facebook、Twitterボタンを追加
文字だけでフォルダのツリー構造や表を作成する方法 これ以上ないくらい簡単な例から学ぶ、レスポンシブwebデザインの作り方
文字だけでフォルダのツリー構造や表を作成する方法 WordPress公式テーマTwenty Tenを子テーマでレスポンシブWebデザインに変更

おすすめの記事

新しいGoogleマップ「Google Maps Platformの使い方」まとめ

新しいGoogleマップ「Google Maps Platformの使い方」まとめ

DNS Amp攻撃の解説と、踏み台にされないためのBIND DNSの設定

DNS Amp攻撃の解説と、踏み台にされないためのBIND DNSの設定

Mac OS 9時代のIDE接続のHDDをMacDrive 10を利用してWindows 10で読み込む方法

Mac OS 9時代のIDE接続のHDDをMacDrive 10を利用してWindows 10…

日々の単純作業を自動化できるUWSCの使い方(入門・書式編)

日々の単純作業を自動化できるUWSCの使い方(入門・書式編)

Web Fontの使い方とGoogle Fontsのオススメフォント 10選

Web Fontの使い方とGoogle Fontsのオススメフォント 10選

初心者でも安全なLAMP環境を構築する方法を解説

初心者でも安全なLAMP環境を構築する方法を解説

WordPressでアイキャッチ画像をサムネイルとして一覧ページに表示する方法

WordPressでアイキャッチ画像をサムネイルとして一覧ページに表…

NexusFontが重い場合はWindows Font Cache Serviceを無効にしよう

NexusFontが重い場合はWindows Font Cache Serviceを無効にしよう


コメントを残す

コメントは認証制のため、すぐには反映されません。

プログラミングに関する質問は「日本語でプログラミングの悩みを解決するQ&Aサイト sukegra」をご利用ください。