均等に配置するための余白を計算するプログラムフォームのソースコード関連する記事Webページのレイアウトやその他のデザインにおいて、同じ大きさの要素を均等(等間隔)に配置したい場合があります。最近は自動的に余白(マージン)を計算してくれるソフトも多いですが、手で計算しなければならない場合のための計算方法を記します。記事の最後には、値を入力するだけで余白を計算できるフォームと、そのプログラムのソースコードについて記載しました。(以下では主に、幅(水平方向)に関しての話となりますが、縦(垂直方向)についても同様です。以下のように、要素間の余白と同じ幅の余白を左右にも設定する場合についてです。この場合は、余白の数の方が要素の数よりも1つ多くなります。すると、以下の式が成り立ちます。S\tag{1}$$図で表すと以下のようになります。式(1)に値を代入すると求められます。40とすれば良いことが計算できます。部分をそれに応じて変更することで、均等に配置するために設定すべき余白の幅が計算できます。以下のように、左右に余白を設けずに要素を等間隔で配置する場合です。今度は、余白の数よりも配置する要素の数が1つ少なくなります。すると、以下の式が成り立ちます。S\tag{2}$$図で表すと以下のようになります。式(2)に値を代入すると求められます。37.5とすれば良いことが計算できます。均等に配置するための余白を計算するプログラム式(1)と式(2)は、それぞれ以下のように変形できます。計算できるフォームです。余白(S):フォームのソースコード上の余白計算フォームを作る全ソースコードです。16進数と10進数を相互変換するフォーム16進数と10進数を相互変換するフォームです。以下の「10進数」の入力欄に10進数を入れて「変換」をクリックすると「16進数」の欄に変換結果が表示されます。同様に16進数から10進数への変換もできます。使って取得する方法についてです。以前、タグに設定したid属性を使ってフォームの値を取得する方法について紹介しました。実際の動作の例は以下のページを御覧ください。コメントをキャンセルメールアドレスが公開されることはありません。