능력치 소개 게시판

김철용

프로필 보기 이 회원 글보기 이 회원의 댓글보기

· 2023-06-17 (토) 21:56:56 · 조회 2724 2724 · 댓글 13 13

링크

http://egis.kr/bbs/board.php?bo_table=basic_test_pc_mobile&page=1&sst=wr_num%2Cwr_reply&page=1 (164)

basic skin을 이용해서 능력치를 나타내는 게시판을 만들어 보았습니다.

압축을 풀면 skills_pc, skills_mobile 두개의 폴더가 나옵니다.

그누보드 순정기준으로

skills_pc는 skin/board/skills_pc의 경로가 되도록 업로드해줍니다.

skills_mobile는 mobile/skin/board/skills_mobile의 경로가 되도록 업로드합니다.

그리고 일반적인 게시판을 적용하는 방법으로 게시판을 만들어줍니다.

테스트: id: test, pw: test

1982431818_1687005939.2054.png

skill1에는 나타내고자 하는 능력의 이름을 적어줍니다.

skill1 능력치에는 스킬의 정도를 나타내는 값을 숫자로 적어줍니다.

4개의 능력치를 표시할 수 있습니다.

능력치와 수치를 입력하지 않으면 능력치가표시되지 않으며 일반 게시판과 동일합니다.

여기에서 입력하는 숫자를 css에서 %로 나타내기 때문에 %없이 숫자만 적어줍니다.

[code]<style>

.skill1 {width: <?php echo $view['wr_2']; ?>%; background-color: #04AA6D;}
.skill2 {width: <?php echo $view['wr_4']; ?>%; background-color: #2196F3;}
.skill3 {width: <?php echo $view['wr_6']; ?>%; background-color: #f44336;}
.skill4 {width: <?php echo $view['wr_8']; ?>%; background-color: #808080;}

</style>[/code]

칼라등을 바꾸시려면 skills.php에서 css를 변경하시면 됩니다.

감사합니다

write.skin.php

[code]
<div class="write_div">
<input type="text" name="wr_1" value="<?php echo $wr_1 ?>" id="wr_1" class="frm_input full_input " size="50" maxlength="255" placeholder="skill 1">
<input type="text" name="wr_2" value="<?php echo $wr_2 ?>" id="wr_2" class="frm_input full_input " size="50" maxlength="255" placeholder="skill 1 능력치">
</div>

<div class="write_div">
<input type="text" name="wr_3" value="<?php echo $wr_3 ?>" id="wr_3" class="frm_input full_input " size="50" maxlength="255" placeholder="skill 2">
<input type="text" id="wr_4" name="wr_4" value="<?php echo $wr_4?>" class="frm_input full_input " size="200" maxlength="2000" placeholder="skill 2 능력치">
</div>

<div class="write_div">
<input type="text" name="wr_5" value="<?php echo $wr_5 ?>" id="wr_5" class="frm_input full_input" size="50" maxlength="255" placeholder="skill 3">
<input type="text" id="wr_6" name="wr_6" value="<?php echo $wr_6?>" class="frm_input full_input" size="200" maxlength="2000" placeholder="skill 3 능력치">
</div>

<div class="write_div">
<input type="text" name="wr_7" value="<?php echo $wr_7 ?>" id="wr_7" class="frm_input full_input" size="50" maxlength="255" placeholder="skill 4">
<input type="text" name="wr_8" value="<?php echo $wr_8?>" id="wr_8" class="frm_input full_input " size="200" maxlength="2000" placeholder="skill 3 능력치">
</div>
[/code]

skills.php

[code]

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>My Skills</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<style>
* {box-sizing: border-box}

.container {
width: 100%;
background-color: #ddd;
}

.skills {
text-align: right;
padding-top: 10px;
padding-right:5px;
padding-bottom: 10px;
color: white;
}