div CSS 양식 레이아웃에 대한 5가지 팁은 양식을 보다 유연하게 제어하고 페이지를 더욱 만족스럽게 만드는 데 도움이 될 수 있습니다.
1. 양식 텍스트 입력을 위한 모바일 선택:
텍스트 입력 필드에 프롬프트가 추가되면 방문자는 마우스를 사용하여 이를 선택하고 삭제한 후 유용한 정보를 입력해야 하는 경우가 많습니다. 실제로 <textarea>에 onMouseOver="this.focus()" onFocus="this.select()" 코드를 추가하기만 하면 다음과 같이 모든 것이 훨씬 더 간단해집니다.
예제 소스 코드 [www.devdao.com ]< textarea name=textarea Wrap=virtualrows=2 cols=22 onMouseOver="this.focus()" onFocus="this.select()">영어를 입력하세요..</textarea>
마찬가지로 <input>에 코드를 추가할 수 있습니다.
2. 양식 입력 단위를 삭제하려면 클릭하세요.
이 열은 위와 동일한 기능을 갖지만, 위와 같이 마우스로 덮어두는 것이 아니라 클릭해야 한다는 점에서 약간의 변화가 있습니다. 예:
예제 소스 코드 [www.devdao.com]<input type=text name="address" size=19 value="Enter,e-mail..."onFocus="this.value=''">
입력수단을 클릭하면 프롬프트 메시지가 삭제되는데, 정말 편리하지 않나요?
3. 양식 입력 단위 테두리 설정:
기존 양식 단위 테두리를 변경하면 홈페이지가 더욱 다채로워집니다. 예:
예제 소스 코드 [www.devdao.com]<input type=radio name=action value=subscribe check style="BORDER-BOTTOM: 점선 1px; BORDER-LEFT: 점선 1px; BORDER-RIGHT: 점선 1px; BORDER - 상단: 점선 1px;배경색: #FEF5C8">
그 중 "style=***"은 왼쪽, 오른쪽, 위쪽, 아래쪽 및 배경색 설정이며 다른 단위에도 적용 가능합니다.
4. 양식 입력 장치의 텍스트 설정:
양식의 단위 글꼴은 다음과 같이 수정할 수 있습니다.
예제 소스 코드 [www.devdao.com]<input type=text name="address" size=19 value=" Enter,e -mail..." style=font-family:"verdana";font-size:10px >
그 중 "style=***"은 글꼴 및 글꼴 크기 설정입니다.
5. 팝업 창에 대한 양식 속성 수정:
대부분의 양식이 활성화된 후에는 현재 페이지에서 열리므로 일반적인 탐색에 영향을 줍니다. 다음과 같이 수정하는 것이 좋습니다.
예제 소스 코드 [www.devdao.com]<form method=POST action=url target=_blank>
그 중 "target=_blank"는 팝업창 열기를 제어합니다.