워드프레스 컨택폼7 텍스트 영역 콜 및 행이 작은 화면에서 변경됨

워드프레스 컨택폼7 텍스트 영역 콜 및 행이 작은 화면에서 변경됨

contactform7을 사용하여 워드프레스 사이트의 컨택폼을 작성했습니다.화면 크기를 줄이려면 해당 양식의 텍스트 영역에 있는 행을 줄이십시오.contactform7만의 구문을 사용하여 사용할 수 있는 방법이 있습니까?그렇지 않다면 어떻게 해야 할까요?

다음은 contactform7 btw의 text area 구문입니다.

 [textarea* your-message 40x7] 

(40 - 콜, 7 - 열)

이 질문은 5년 이상 지났지만, 여전히 정기적으로 유효하고, 저처럼 많은 사람들이 이 질문에 대한 명확한 답을 얻으려고 노력합니다.

입력도 가능합니다.10x콜 및x21개의 Atribute만을 가지는 경우는, 행에 대해 지정합니다.

[textarea* your-message x3 class:form-control] <!-- only rows -->
[textarea* your-message 10x class:form-control] <!-- only columns -->
[textarea* your-message 10x3 class:form-control] <!-- both -->

문서 http://contactform7.com/text-fields/ #textarea에서 참조할 수 있습니다.

[textarea* message id:contact-message 10x2 placeholder "Your Message"]

위의 텍스트 영역은 cols="10" 및 rows="2"로 생성됩니다.

<textarea name="message" cols="10" rows="2" class="wpcf7-form-control wpcf7-textarea wpcf7-validates-as-required" id="contact-message" aria-required="true" aria-invalid="false" placeholder="Your Message"></textarea>

나는 이 일을 할 수 있었다.커스텀 CSS에 다음 항목을 추가했습니다.

.wpcf7-form textarea{ 
    width: 100% !important;
    height:50px;
}

코드는 아래와 같습니다.

[textarea id:message 0x0 class:custom-class "Insert text here"]<!-- No Rows No columns -->

[textarea id:message x2 class:custom-class "Insert text here"]<!-- Only Rows -->

[textarea id:message 12x class:custom-class "Insert text here"]<!-- Only Columns -->

[textarea id:message 10x2 class:custom-class "Insert text here"]<!-- Both Rows and Columns -->

상세한 것에 대하여는, https://contactform7.com/text-fields/ 를 참조해 주세요.

플레이스홀더 속성 뒤에 추가합니다.

[textarea* message id:message class:form-control 40x7 placeholder "Message"]

콜과 행을 추가하려면 x 예를 사용합니다.cols=80 및 rows=5가 필요합니다. 이 값은 80x5입니다. 컨트롤 이름 뒤에 배치해야 합니다.

[textarea* your-message id:your-message 80x5]

css를 추가하여 시도할 수 있습니다.

.master-cf7-0 .wpcf7 textarea{height:150px;}

먼저 기사에 대한 양식을 만들고 이 구문을 사용하십시오.

[text area* your-message 40x7]

x2 등으로 덱스터의 회답을 시험해 봤지만 효과가 없었습니다.

CSS는 사이즈를 변경하기 위해 정상적으로 동작했습니다.

.wpcf7-textarea {height: 200px;}

언급URL : https://stackoverflow.com/questions/29025956/wordpress-contactform7-textarea-cols-and-rows-change-in-smaller-screens