STYLE属性の適用

どうしてもタグの属性設定だけでうまく表示できないんでSTYLE属性を使ってみることにしました。
ただし、ＨＰじゃないのでどれだけユーザーの意図にあった効果が得られるかは不明なので一度テストしてみました。
アメブロでのタグ編集モードでは自動的に改行が挿入されてはっきりいってこちらの思いとおりになりません。
下記の画面レイアウトの行間隔を変更するためにＦＯＮＴタグにスタイル属性（line-height）を適用してみました。

【適用前】

■画面レイアウト

１１１１１１１１１１２２２２２２２２２２３３ 　　　０１２３４５６７８９０１２３４５６７８９０１２３４５６７８９０１ 　　┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓ 　０┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　１┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　２┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　３┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　４┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　５┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　６┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　７┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　８┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　９┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １０┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １１┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １２┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １３┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １４┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １５┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １６┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １７┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １８┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １９┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ ２０┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ ２１┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ ２２┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ ２３┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　　┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛

【適用後】

■画面レイアウト

１１１１１１１１１１２２２２２２２２２２３３ 　　　０１２３４５６７８９０１２３４５６７８９０１２３４５６７８９０１ 　　┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓ 　０┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　１┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　２┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　３┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　４┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　５┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　６┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　７┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　８┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　９┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １０┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １１┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １２┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １３┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １４┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １５┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １６┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １７┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １８┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １９┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ ２０┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ ２１┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ ２２┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ ２３┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　　┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛

【はじめてのプチコン】出力

メモ あまりゲームらしくない話が続いたんでここで少し話題を変えましょう。 ただし、今までの話は非常に重要な内容なんで時間をかけて理解していきましょう。 プログラムで一番重要なのは計算をすることです。 しかし、ただの計算（処理）だけではゲームになりません。 計算した結果を表示（出力）する必要があります。 また、ゲームをしているプレイヤにどうしたらいいか指示（入力）をしてもらう必要があります。 そしてコンピュータはその指示（入力）を判断し次の行動を行わなければなりません。 これらの手順（アルゴリズム）をコンピュータに理解させるのがプログラムです。

PRINT 文は出力を行う代表的な命令です。
この PRINT 文でどんなことができるかサンプルを見ながら理解していきましょう。
PRINT 文は数値や文字列を画面に表示する命令でが、その際に同時に覚えておきたい命令があります。

■書式

CLS 画面に出力されている内容を消去する。

■書式

LOCATE Ｘ座標,Ｙ座標 画面の表示位置を指定する。

次のプログラムを入力し実行しましょう。
ただし、実行する前に必ずどうなるか想像してください。
実行結果が自分の想像と違う場合はどこが違うのかを確認するようにしてください。
あと、プログラム中では A を使っていますがこれはＵＦＯの絵文字を使ってください。
さすがに通常のＰＣにはＵＦＯの絵文字はないので英数字の"A"で代用します。

■プログラム

0001 CLS 0002 LOCATE 0, 0 0003 PRINT "A" 0004 END

■実行結果

A OK

プログラムの解説です。
0001行目の CLS は画面を消去します。
これですでに表示されている内容が消えます。
0002行目のLOCATE 命令は表示する位置を指定します。
プチコンの場合は横が３２桁で縦は２４行になります。
プログラムの場合数を指定する時に使う数値は０から始まります。
要するに横は０桁から３１桁まであり、縦は０行目から２３行目までということになります。
画面の位置は横がＸ軸、縦がＹ軸で表す座標となるのですが数学などの場合この座標はＸ軸が横方向、Ｙ軸が縦方向で同じなのですが、Ｙ軸の上が０で下に行くほど座標が大きくなります。
指定した位置に文字を表示し終了します。
ＵＦＯが画面左上に表示されていますか？

■画面レイアウト

１１１１１１１１１１２２２２２２２２２２３３　Ｘ 　　　０１２３４５６７８９０１２３４５６７８９０１２３４５６７８９０１　→ 　　┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓ 　０┃仝　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　１┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　２┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　３┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　４┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　５┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　６┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　７┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　８┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　９┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １０┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １１┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １２┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １３┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １４┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １５┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １６┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １７┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １８┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ １９┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ ２０┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ ２１┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ ２２┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ ２３┃　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　┃ 　　┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛ 　↓Ｙ

※ＵＦＯ絵文字の代わりに "仝" を代用しています

【はじめてのプチコン】アルゴリズム（条件判定）

同じ処理を繰り返し実行するアルゴリズムをループといいます。

しかし、前回のプログラムでは処理が終了しない無限ループになっていました。

これでも問題ない場合もあるのですが、一般的には処理を中断ではなく（正常に）終了させたいと思います。

そのためにはこのループを終了させるための何かが必要になります。

では、それはいったい何でしょうか？









それはループを終了するための条件です。
そしてプログラムでその条件を判断することができればプログラムを正常に終了させることができそうですね。
そこでこの条件を判断するのが IF 文です。

■書式

IF 条件式 THEN 文 条件を判断し、条件が成り立てば THEN に続く文を実行する もし条件が成り立たなければ IF 文の次の文を実行する

ここで条件式というのは式なのですが式は計算をしその結果を返します。
しかし説明する場合に少しわかりにくいのでしばらくは式でなく条件式と記述しておきます。
具体的にいうと条件式は比較演算子を使った式ということにしておきます。
使用できる比較演算子は下記の通りです。

■比較演算子
＝＝	両辺が等しい
！＝	両辺が等しくない
＞	左辺が右辺より大きい
＜	左辺が右辺より小さい
＞＝	左辺が右辺以上
＜＝	左辺が右辺以下

今回のプログラムでは単価を入力する際に０を入力すると終了することにします。
単価が０円の商品は確かにないことはないのですが…今回はないことにします。

それでは IF 文を使って処理を正常に終了させます。
処理の正常終了は END 文で問題ありません。

■プログラム

0001 @LOOP 0002 INPUT "TANKA";T 0003 IF T == 0 THEN END 0004 INPUT "SUURYOU";S 0005 K = T * S 0006 PRINT "KINGAKU=";K 0007 GOTO @LOOP

■実行結果

TANKA? 100 SUURYOU? 3 KINGAKU=300 TANKA? 50 SUURYOU? 10 KINGAKU=500 TANKA? 0 OK

この様に単価を入力した後に単価が０かどうかを判断し、
もし０であれば END 文を実行しプログラムを正常終了する。
０でなければ数量を入力して計算をすればいいですよね＾＾