입력 상자와 버튼을 구별하는 방법-CSS 튜토리얼-php.cn

입력 상자와 버튼을 구별하는 방법

巴扎黑

풀어 주다： 2017-08-14 14:57:35

원래의

2036명이 탐색했습니다.

스타일 설정 시 입력이 버튼인지 텍스트 상자인지 구별하는 방법에 대한 기술적 조사 - 입력에서 내용을 꺼내세요

html 태그 를 보면 어떤 생각이 드시나요? 텍스트 상자? 버튼? 라디오 버튼? 체크박스? ...네, 네, 네, 괜찮습니다. 아마도 이 작은 입력이 실제로 10가지의 다른 것을 생성할 수 있다고 생각하지 않았을 수도 있습니다. 다음은 생각하지 못한 항목을 확인할 수 있는 목록입니다.
텍스트 상자
< ;입력 유형 ="password" /> 비밀번호 상자
제출 버튼
버튼
체크박스
일반 버튼
파일 선택 제어
숨겨진 상자
이미지 버튼
입력은 정말 좋은 일이고 너무 "도발적"이라고 말할 수 있지만, 실제로 다르게 설정하려고 하면 프로젝트의 다양한 컨트롤에 대한 스타일을 사용하면 입력이 실제로 "머리를 크게" 만들 수 있다는 것을 알게 될 것입니다. 애초에 입력에 왜 이렇게 많은 ID가 부여되었는지는 모르겠지만 "N-fold ID"는 웹사이트 디자이너에게 많은 문제를 가져왔습니다. 다행히 일하는 사람들은 훌륭하고 문제를 해결할 방법은 아직 남아 있습니다 ~ 비록 모두 치명적인 단점이 있지만 Orz ... 해방 방법을 대략적으로 요약하면 목록은 다음과 같습니다 (저는 그다지 재능이 없습니다 이므로 실수나 누락이 불가피하니 조언 부탁드립니다.) 지침):

1. CSS 표현식을 사용하여 표현식을 판단합니다.
2. CSS에서 유형 선택기를 사용합니다.
4. 프로젝트를 개발하기 위해 Microsoft Visual Studio 2005 또는 후속 버전을 사용하고 계십니다. 축하합니다. 스킨을 사용할 수도 있습니다.

각 방법의 세부 구현과 장단점을 설명하겠습니다.

1: CSS 표현식을 사용하여 표현식을 판단합니다.
구현 코드 참조:

doctype html public "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
<html xmlns="http://www.w3.org/1999/xhtml" >
< 머리 >
    <title> diffInput2 title>
     <메타 name="저자 " content="JustinYoung"/>
    <meta name="키워드" content="" />
<meta name="Description" content=""/>
    <meta http-equiv="내용- Type" content="text/html; charset=utf-8"/>
    <style type="text/css">
    input
    {
     background-color:expression(this.type=="text"?'#FFC':'');
     }
     style>
head>

<body>
< dl>
<dt>이것은 일반적인 텍스트 상자입니다:<dd><input type="text" 이름 =" ">
<dt>이것은 정상적인 버튼입니다:<dd><input type ="버튼 " value="나는 버튼입니다">
dl>
body & gt;
html>

장점: 단순, 경량
단점: 표현 판단 표현 FireFox에서는 지원하지 않습니다. 치명적인 점은 하나만 구별할 수 있다는 것입니다(예: 예에서는 텍스트 텍스트 상자만 구별할 수 있습니다). 여러 개를 설정하려고 하지 마세요. 다음 항목이 맨 위에 있는 항목을 덮어쓰게 됩니다. Orz...

위 내용은 입력 상자와 버튼을 구별하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!