[PHP] CSS 제어 프로그램 만들기 (7/8) - CSS 입력 페이지 만들기
2022. 10. 19. 21:52ㆍ무료강좌&튜토리얼/PHP
[PHP] CSS 제어 프로그램 만들기 (7/8) - CSS 입력 페이지 만들기
앞에서 생성한 controlCSS 테이블에 값을 입력하는 페이지를 생성해보자.
이 페이지는 총 5개의 form 태그를 사용한다. 각각 wrap, leader, lefrArea, rightArea, footer가 selectorName 필드의 레코드에 값을 입력하는 용도의 form 태그이다.
다음은 CSS 데이터의 입력폼을 생성하는 예제이다.
[예제: 168_controlPanel.php ]
<?php
include_once $_SERVER['DOCUMENT_ROOT'] . '/php/csscontrolpanel/163_connection.php';
$sql = "SELECT * FROM controlCSS";
$result = $dbConnect->query($sql);
$dataCount = $result->num_rows;
$cssSelectorList = array();
for ($i = 0; $i < $dataCount; $i++) {
$cssData = $result->fetch_array(MYSQLI_ASSOC);
array_push($cssSelectorList, $cssData);
}
$floatList = array();
$floatList = ['left', 'right', 'none', 'unset'];
$borderWidthList = array();
$borderWidthList = range(1, 10);
?>
<!DOCTYPE html>
<html lang="ko">
<head>
<style>
span {
float: left;
margin-left: 10px;
padding: 10px;
border: 1px solid black
}
</style>
</head>
<body>
<h1>CSS CONTROL PANEL</h1>
<br>
<?php
foreach ($cssSelectorList as $csl) {
?>
<span>
<h2><?= $csl['selectorName'] ?></h2>
<form name="wrap" method="POST" action="./169_controlPanelSave.php">
<h3>흐름</h3>
<select name="float">
<?php
foreach ($floatList as $fl) {
$isChecked = '';
if ($fl == $csl['floata']) {
$isChecked = 'selected';
}
echo "<option value='{$fl} $isChecked>{$fl}</option>";
}
?>
</select>
<h3>가로길이</h3>
<input type="number" name="width" value="<?= $csl['width'] ?>" />px
<br>
<h3>세로길이</h3>
<input type="number" name="height" value="<?= $csl['height'] ?>" />px
<br>
<h3>배경색</h3>
<input type="color" name="background" value="<?= $csl['background'] ?>" />
<br>
<h3>바깥여백</h3>
위
<br>
<input type="number" name="marginTop" value="<?= $csl['marginTop'] ?>" />px
<br><br>
오른쪽
<br>
<input type="number" name="marginRight" value="<?= $csl['marginRight'] ?>" />px
<br><br>
아래
<br>
<input type="number" name="marginBottom" value="<?= $csl['marginBottom'] ?>" />px
<br><br>
왼쪽
<br>
<input type="number" name="marginLeft" value="<?= $csl['marginLeft'] ?>" />px
<br><br>
<input type="hidden" name="selectorName" value="<?= $csl['selectorName'] ?>" />
<input type="submit" value="<?= $csl['selectorName'] ?> 적용" />
</form>
</span>
<?php
}
?>
</body>
</html>실행 URL은 http://localhost/php/csscontrolpanel/controlCSS/168_controlPanel.php 이다.
실행결과
초보자를 위한 PHP 200제
김태영 지음 | 정보문화사
'무료강좌&튜토리얼 > PHP' 카테고리의 다른 글
| [PHP] 회원가입, 로그인 기능 만들기 (1/8) - 메인페이지 만들기 (1) | 2022.10.21 |
|---|---|
| [PHP] CSS 제어 프로그램 만들기 (8/8) - CSS 정보 저장하기 (0) | 2022.10.19 |
| [PHP] CSS 제어 프로그램 만들기 (6/8) - CSS 파일 만들기 (0) | 2022.10.19 |
| [PHP] CSS 제어 프로그램 만들기 (5/8) - CSS 레코드 입력하기 (0) | 2022.10.18 |
| [PHP] CSS 제어 프로그램 만들기 (4/8) - CSS 적용할 페이지 만들기 (0) | 2022.10.18 |