0

まだ4.1を使用していて、フォームのコンテンツを画面の中央に配置しようとしています。新しいフォームを追加すると、画面の「左側」に残ります。

form.html（temmplates / shared）を変更して、次のようなスタイルのdivを追加しようとしました。

margin-left : 10%; margin-right : 10%;

フォームタグの横にあり、下部で閉じます。

フォームは右に移動しますが、中央に配置されません。

誰かがこれを助けるための手がかりを持っていますか？

これは単純なフォームのスクリーンショットです（モデルに基づくものではありません）

フォームの例

ありがとうアレハンドロ

4

3 に答える 3

0

ここには、フォームレイアウト自体を調整するために使用できるさまざまなフォームレイアウトの例がいくつかあります。フォームをページの中央に配置するのか、フィールドを中央に配置するのか、質問からはわかりません。

フォームをWebページ内で中央揃えにするだけの場合は、margin：autoを使用して、ここに示すように両側にパーセンテージを設定するのではなく、cssを中央揃えにします。

また、atk4ディレクトリからファイルを修正する場合は、サイト/テンプレート/共有にコピーを作成し、そこで修正して、後で何も失うことなくatk4ディレクトリを上書きしてアップグレードできるようにする必要があることに注意してください。

于 2012-07-14T16:09:40.020 に答える
0

デフォルトのフォームテンプレート（この場合はCRUD）を使用すると、次のようになります

ここに画像の説明を入力してください

追加してatk4/templates/form.htmlに変更を加えた場合

<div style="width: 50%; margin: 0 auto;">

form.htmlの2行目として、対応するものを追加します

</div>

下から1行、次のようにすべてを少し右にシフトします

ここに画像の説明を入力してください

あなたの質問で不明確なのは、あなたが達成しようとしていることです-フォーム内のフィールドを移動したいですか、それともフォーム全体をページの中央に配置したいですか？

シフトの理由は、幅を50％に設定したためだと思いますが、どのレイアウトを取得しようとしているのかわかりません。ラベルをフィールドに正しく配置したいだけですか？あなたが得ているものの元の質問にスクリーンショットを投稿し、あなたが達成したいことを説明してみてください。

于 2012-07-16T19:20:06.563 に答える
0

わかりました-デモンストレーションのためにデフォルトのatk4.2に移動しました。

次のようにデフォルトで新しいページを追加する場合

<?php
   class page_test extends Page {
   function init() {
     parent::init();
     $p=$this;

     $f=$p->add('MVCForm')->setModel('Customer');
   } 
}
?>

次のようになり、フィールドはページの幅全体に広がります。

ここに画像の説明を入力してください

これは、デフォルトのページテンプレートが全幅を取り、予想されるためです。

フォームを調整するには、ビュー機能を使用できるため、Centre.phpという名前の/ lib / Viewディレクトリの下にビューを作成し、その中に次のコードを配置します

<?php
class View_Centre extends View {
   function init(){
      parent::init();
   }

   function defaultTemplate() {
     return array('view/centre');
   }

}
?>

次に、yoursite / templates / default / viewにcentre.htmlという名前のビューの新しいテンプレートを作成し、次のhtmlコードを挿入します。

<div style='width:50%; margin: auto;'>
  <?$Content?>
</div>

次に、ページで、最初にビューを追加し、フォームをページに直接追加するのではなく、ビューに追加します。

<?php
  class page_test extends Page {
    function init() {
      parent::init();
      $p=$this;

      $v=$p->add('View_Centre');
      $f=$v->add('MVCForm')->setModel('Customer');
    } 
  }
 ?>

これにより、次のWebページが作成されます。

ここに画像の説明を入力してください

基本のATK4フォーム自体はビューです。つまり、フォームを好きなようにスタイル設定できます。たとえば、ここで説明するような別のスタイルのフォームを使用する場合は、site / atk4 / atk4 /templates/をコピーしてこれを行うことができます。 shared/form.htmlをyoursite/atk4 / templates / shared.form.htmlに変更し、2行目を

 <?form?>
   <div id="<?$_name?>" class="atk-form <?$class?>" style="<?$style?>">
   <?$hint?>
   <form class="<?$form_internal_class?>" id="<?$form_name?>" name="<?$form_name?>" action="<?$form_action?>" method="POST" <?$enctype?>>
   <fieldset class="<?$fieldset?>">

に

 <?form?>
   <div id="stylized>" class="myform <?$class?>" style="<?$style?>">
   <?$hint?>
   <form class="<?$form_internal_class?>" id="<?$form_name?>" name="<?$form_name?>" action="<?$form_action?>" method="POST" <?$enctype?>>
    <fieldset class="<?$fieldset?>">

スタイリングを含む新しいform.cssファイルをyoursite/templates / default/cssに作成します

yoursite / atk4 / templates / shared /shared.htmlをyoursite/templates / shared / shared.htmlにコピーし、タグを追加します

  <?$css_include?>

既存のすぐ上

   <?$js_include?>

そしてFrontend.phpで、すべてのページに新しいcssファイルを見つけさせます。

    $this->addLocation('templates',array(
                       'css'=>array(
                         'default/css',
                        ),
          ));
          $this->template->appendHTML('css_include','<link type="text/css" href="'.$this->api->locateURL('css','form.css').'" rel="stylesheet">');

このようなスタイルのフォームになります

ここに画像の説明を入力してください

于 2012-07-17T19:58:32.850 に答える