sub_title
 CSS3
제   목 selectbox 정렬
작성자 알카도 등록일 2017-04-27 01:05:28 조회수 6,985

selectbox 정렬

 

select 박스안의 텍스트들은 기본적으로 왼쪽 정렬이지만,  오른쪽 정렬도 가능합니다.

 

아래는 간단한 샘플입니다.

 

샘플 1)

 

<!DOCTYPE HTML>

<HTML>

<HEAD>

<TITLE>SELECT BOX 정렬</TITLE>

</HEAD>

<BODY>

<table style="width:500px;">

   <tbody>

      <tr >

        <th scope="row">분류선택</th>

            <td colspan="3"> 

          <select style='width:50%float:left;' name="sel1" class="frm_input required" required >

<option value="">선택</option>

<option value="선택1">선택1</option>

<option value="선택2">선택2</option>

</select>&nbsp;

<select style='width:49%;float:right;' name="sel2" class="frm_input required" required >

                            <option value="">선택</option>

<option value="선택3">선택3</option>

<option value="선택4">선택4</option>

</select>

 

            </td>

        </tr>

 </tbody>

</table>

</BODY>

</HTML>

 

샘플 2)

<!DOCTYPE HTML>

<HTML>

<HEAD>

<TITLE> New Document </TITLE>

</HEAD>

<BODY>

<table style="width:500px;">

   <tbody>

      <tr >

        <th scope="row">분류선택</th>

            <td colspan="3"> 

          <span style="width:50%float:left;"> 

          <select name="sel1" class="frm_input required" required >

<option value="">선택</option>

<option value="선택1">선택1</option>

<option value="선택2">선택2</option>

</select>&nbsp;

</span>

<span style="width:50%;float:right;"> 

<select name="sel2" class="frm_input required" required >

                            <option value="">선택</option>

<option value="선택3">선택3</option>

<option value="선택4">선택4</option>

</select>

</span>

 

            </td>

        </tr>

 </tbody>

</table>

</BODY>

</HTML>

 
1
    
 
1
        list
 
※ 짧은 댓글일수록 예의를 갖추어 작성해 주시기 바랍니다.
line
reply cancel
 
번호 제목 글쓴이 추천 조회 날짜
33  div display 속성   member 오렌지 0 / 0 3187 2018-05-12
32  css로 스크롤해도 상단에 고정되는 메뉴 만들기   member 오렌지 0 / 0 6418 2018-05-09
31  selectbox 정렬   member 알카도 1 / 1 6985 2017-04-27
30  상단에 고정되는 헤더를 사용했을때 슬라이더 이미지가 겹쳐보이는 문제   member 오렌지 0 / 0 2569 2017-04-12
29  div 안에 div를 사용하여 이미지를 정중앙에 정렬하기(가로,세로)   member 오렌지 1 / 2 7371 2016-11-07
28  페이지의 하단에 footer 고정 시키기 이미지   member 호야돌이 7 / 1 59798 2016-11-04
27  div 내의 텍스트 가운데 정렬하기    member 호야돌이 3 / 0 9233 2016-11-03
26  div 내의 이미지 가운데 정렬하기   member 호야돌이 1 / 8 30832 2016-10-27
25  배경이미지에 적용할 CSS   member 웹스톤 0 / 0 7880 2008-10-03
24  [CSS]필터를 활용하자 - 포토샵 필터 적용 예시   member 웹스톤 0 / 0 4822 2008-09-02
23  [CSS] 사이드바 둥근모서리 처리방법! 이미지 첨부파일   member 웹스톤 1 / 0 5574 2008-08-08
22  IE6,IE7 ,FireFox 에 대해 CSS 맞추기 이미지   member 뽀샤시 1 / 0 4038 2008-05-06
21  [CSS 강좌]스타일시트를 사용하는 4가지 방법 이미지   member 웹돌이 0 / 1 4793 2007-12-11
20  DHTML, CSS, 태그, 스타일시트 정리   member 웹돌이 1 / 0 6805 2007-12-11
19  스타일시트 기본구조   member 오렌지 1 / 0 4169 2007-12-10
18  스타일 시트의 정의 + 3가지 형태의 적용 방법   member 오렌지 1 / 0 5919 2007-12-10
17  MX 2004 CSS 문서의 한글 깨짐현상을 해결하는 팁   member 오렌지 1 / 1 5611 2007-11-20
16  스타일로 테두리 다루기(3D)   member 웹돌이 1 / 0 4442 2007-10-09
15  스타일로 테두리 다루기!   member 웹돌이 0 / 1 3804 2007-10-09
14  스타일로 줌 효과 주기!   member 웹돌이 0 / 1 4300 2007-10-09
13  링크에 여러가지 효과 주기   member 웹돌이 1 / 0 4571 2007-10-09
12  문단서식 방향바꾸기   member 웹돌이 1 / 0 3347 2007-10-09
11  Rollover 기능!   member 웹돌이 1 / 0 4114 2007-10-09
10  CSS 로 브라우져 구분없이 글짜 자르기   member 웹돌이 0 / 0 3357 2007-10-09
9  폼요소를 위한 스타일   member 오렌지 0 / 0 3504 2007-09-29
write
[2] button