<p>Django 웹사이트를 만들었고 상단에 작은 형식처럼 결과를 표시하고 싶습니다. 왼쪽에 테이블이 있는데 오른쪽 테이블에 두 장의 사진과 또 다른 열을 추가하고 싶습니다. 더 잘 설명하기 위해 다이어그램을 디자인했습니다.
여기에 이미지 설명을 입력하세요</p>
<p>이제 Form 1과 테이블에 대한 코드를 작성했습니다. 백엔드 코드도 작성합니다. 이미지와 양식 2가 양식의 오른쪽에 있으므로 HTML 코드를 작성하는 방법을 알고 싶습니다. HTML 코드를 작성하면 표 아래에 표시됩니다. 누구든지 테이블 오른쪽에 그림과 양식 2를 추가하는 데 도움을 줄 수 있습니까? </p>
<p>현재 HTML 코드는-</p>
<pre class="brush:php;toolbar:false;">*{% 확장 'login/basic.html' %}
{% 블록 제목 %}개수 승인{% 엔드블록 제목 %}
{% 블록 본문 %}
<!-- <div class="컨테이너 my-5 px-2" -->
<form action="/approval" method="post">{% csrf_token %}
<!-- <div class="컨테이너" >
<div class="form-group mx-5 my-3">
<div class="form-group mx-5 my-3">
<label class="my-3" for="날짜">날짜</label>
<입력 유형="날짜" id="날짜" 이름="날짜">
</div>
<label class="form-group mx-5 my-3" for="servers">에서 서버를 선택하세요 - {{serverLst}}</label>
<div class="form-group mx-5 my-3">
<이름 선택="서버 이름" id="forserver" 크기="4" 배수>
{serverLst %의 서버에 대한 %}
<옵션 값="{{서버}}">{{서버}}</option>
{% 종료: %}
</선택>
</div>
<버튼 유형="제출" class="btn btn-primary mx-5 my-3">제출
</div>
</div> -->
<div class="row g-2">
<div class="col-md">
<div class="form-floating">
<입력 유형="날짜" class="양식 제어" id="floatingInputGrid"; 이름="날짜">
<label for="floatingInputGrid">교대 날짜</label>
</div>
</div>
<div class="col-md">
<div class="form-floating">
<이름 선택="서버 이름" class="양식 선택" id="floatingSelectGrid">
<옵션이 선택됨>서버 이름</option>
{serverLst %의 서버에 대한 %}
<옵션 값="{{서버}}">{{서버}}</option>
{% 종료: %}
</선택>
<label for="floatingSelectGrid">서버 선택</label>
</div>
</div>
<div class="col-md">
<div class="form-floating">
<버튼 유형="제출" class="btn btn-primary mx-5 my-2" id="floatingInputGrid">제출</button>
</div>
</div>
</div>
</양식>
<!-- 테이블 -->
<테이블 클래스="테이블" style="너비:25%">
<머리>
<tr>
<번째 범위="col">사용자 이름</th>
<번째 범위="col">시작</th>
<번째 범위="col">Ending</th>
<번째 범위="col">보너스</th>
</tr>
</머리>
<본문>
<tr>
<번째 범위="행">1</th>
<td>마크</td>
<td>오토</td>
<td>@mdo</td>
</tr>
<tr>
<번째 범위="행">2</th>
<td>야곱</td>
<td>손튼</td>
<td>@fat</td>
</tr>
<tr>
<번째 범위="행">3</th>
<td colspan="2">새 래리</td>
<td>@트위터</td>
</tr>
</tbody>
</테이블>
<!-- </div> -->
{% 엔드블록 %}</pre>
</ul>
<p>任何改进我的html代码的建议道将不常有帮助，如果有任何html错误，请忽略。</p>
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
CSS 속성, 특히 위치:절대 또는 위치:고정을 사용해 보세요. 'https://sbgsdjango.herokuapp.com/English', 이 웹사이트는 여러분을 위한 데모이므로 필요하지 않습니다