css+javascript를 이용한 첨부파일 입력폼 > 공책

<style>
/* add file */
#bo_w .bo_w_file .file_wr {position:relative;}
#bo_w .bo_w_file .file_wr label {display:block;position:absolute;width:120px;height:40px;left:0;top:0;padding:0;color:#fff;line-height:40px;font-weight:300;text-align:center;background:#444;border:none;cursor:pointer;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
#bo_w .bo_w_file .file_wr label:hover {background:#222;}
#bo_w .bo_w_file .file_wr label input {position:absolute;width:0;height:0;overflow:hidden;}
#bo_w .bo_w_file .file_wr input[type=text] {display:block;width:100%;height:40px;line-height:40px;text-indent:130px;border:solid 1px #ccc;}
#bo_w .bo_w_file .frm_file {}
#bo_w .bo_w_file .file_del {display:inline-block;position:relative;min-width:100px;}
#bo_w .bo_w_file .file_del img {vertical-align:middle;}
</style>


<?php for ($i=0; $is_file && $i<$file_count; $i++) { ?>
<div class="bo_w_file write_div">
	<span class="label">첨부파일 #<?php echo $i+1 ?></span>
	<div class="file_wr">
		<label for="bf_file_<?php echo $i+1 ?>" class="lb_icon">첨부파일 #<?php echo $i+1 ?>
		<input type="file" name="bf_file[]" id="bf_file_<?php echo $i+1 ?>" title="파일첨부 <?php echo $i+1 ?> : 용량 <?php echo $upload_max_filesize ?> 이하만 업로드 가능" class="frm_file" onchange="javascript:document.getElementById('bf_addfile_<?php echo $i+1 ?>').value=this.value"></label>
		<input type="text" class="frm_input" id="bf_addfile_<?php echo $i+1 ?>" readonly="readonly" title="파일첨부 <?php echo $i+1 ?> : 용량 <?php echo $upload_max_filesize ?> 이하만 업로드 가능">
	</div>
	<?php if ($is_file_content) { ?>
		<input type="text" name="bf_content[]" value="<?php echo ($w == 'u') ? $file[$i]['bf_content'] : ''; ?>" title="파일 설명을 입력해주세요." class="frm_input" style="margin:5px 0 0 0;" size="50" placeholder="파일 설명을 입력해주세요.">
	<?php } ?>

	<?php if($w == 'u' && $file[$i]['file']) { ?>
	<span class="file_del chk_box">
		<input type="checkbox" id="bf_file_del<?php echo $i ?>" name="bf_file_del[<?php echo $i;  ?>]" value="1" class="selec_chk"> <label for="bf_file_del<?php echo $i ?>"><span></span><?php echo $file[$i]['source'].'('.$file[$i]['size'].')';  ?> 파일 삭제</label>
	</span>
	<?php } ?>

</div>
<?php } ?>