홈>2020-02-01 01:26

html - 에서 텍스트에 공백을 넣는 방법

이미지에서 볼 수 있듯이 왼쪽과 오른쪽 공간을 텍스트 내부에 배치하고 싶습니다. 텍스트 들여 쓰기로 왼쪽 공간을 넣을 수 있었지만 올바른 공간에서는 작동하지 않는 것 같습니다.

아무도 나를 도울 수 있습니까? 샘플 이미지

답변 # 1
한 텍스트 상자에 원하는 경우 class 를 추가하십시오 아래처럼 css 에서 사용하십시오.
```
<input type='text' name='firstname' class='space'>
    .space
    {
        padding-left : 10px;
        padding-right: 10px;
    }
```
양쪽을 원하면 padding 를 사용할 수 있습니다 이 방법을 사용하면 창에 적절한 공간이있을 때 작동합니다. 화면 크기에 공간을 유지하려면 테두리 상자를 사용할 수 있습니다.
```
.space
{
    padding-left : 10px;
    padding-right: 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
```
답변 # 2
여기서 입력은 들여 쓰기를 위해 오른쪽 패딩을 남길 수 있습니다.
```
input {padding: 0 5px}
```
위의 입력은 왼쪽과 오른쪽으로 5px의 공간을 차지합니다.
답변 # 3
마크 업에서 허용하는 경우 텍스트 들여 쓰기와 패딩을 결합하는 것이 좋습니다 :
```
text-indent: 10px;
padding-right: 20px;
```
또 다른 방법은 "text-align : left"와 함께 "rtl"값을 가진 "direction"속성 일 수 있습니다.

답변 # 4

다음 코드를 시도하십시오

input{
    border: none;
    padding: 10px;
    margin: 10px;
    height: 20px;
    width: 500px;
    border:1px solid #eaeaea;
    outline:none;
}
input:hover{
    border-color: #a0a0a0 #b9b9b9 #b9b9b9 #b9b9b9;
}
input:focus{
    border-color:#4d90fe;
}

<div class="mainDiv">
<input type="text" />
</div>

답변 # 5
입력 텍스트에 패딩을 설정할 수 있습니다 :
```
input {
  padding: 0 5px /* 0 is for top and bottom | 5px is for left and right */
}
```
다음은 CSS 패딩 속성에 대한 문서입니다 : https://www.w3schools.com/css/css_padding.asp

Python2.net

html - 에서 텍스트에 공백을 넣는 방법

관련 자료