필수 양식 옵션에 별표를 추가하는 CSS에 대한 자세한 설명

양식에 별표를 추가한다는 것은 필수 필드를 의미합니다. 우리는 실제로 이 기능을 많이 보았습니다. 이번 글에서는 CSS를 사용하여 양식의 필수 필드에 별표를 추가하는 예를 살펴보겠습니다. 모두를 도울 수 있습니다.

<script>ec(2);</script>

웹 양식을 만들 때 옵션이 필요한 경우 일반적으로 WordPress 댓글 양식과 같이 옵션에 별표를 추가합니다.

<p class="form-group">
   <label for="author">姓名</label> <span class="required">*</span>
   <input type="text" id="author" name="author" required="required" size="30" class="form-text">
  </p>

그런 다음 별표에 약간의 CSS 스타일을 추가합니다.

  .form-group span.required {
   color: #999;
   font-size: 150%;
  }

CSS to Adding 양식에 별표는 필수 옵션입니다

하지만 때로는 HTML 구조를 수정할 수 없거나 의미 없는 태그를 추가하고 싶지 않을 수도 있습니다. 이 경우 의사 클래스 뒤에 CSS를 사용할 수 있습니다. 별표를 생성합니다.

위 양식에서 * 코드를 삭제한 다음 CSS를 추가하세요.

  .form-group label:after {
   content: ' *';
   color: #999;
   font-size: 150%;
  }

이 방법으로 CSS를 사용하여 필수 선택.

사실, 의사 클래스 전후의 CSS는 사용하기가 매우 쉽습니다. 대부분의 사람들은 단지 플로트를 제거하는 데 사용합니다. 실제로 상상력을 발휘하면 이 두 가지 의사 클래스를 잘 활용하면 놀라운 일을 할 수 있습니다. -수업.

관련 권장 사항:

CSS의 속성 값 상속에 대한 지식 종합 요약

순수 CSS에서 텍스트 생략을 사용자 정의하는 종합 방법

CSS 단락 속성에 대한 자세한 설명

위 내용은 필수 양식 옵션에 별표를 추가하는 CSS에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!