방금 직접해야 했으므로 다른 방법으로해야합니다.
- 텍스트의 세로 정렬로 재생 하지 마십시오
- 멋진 글꼴 아이콘의 세로 정렬로 재생
<div>
<span class="icon icon-2x icon-camera" style=" vertical-align: middle;"></span>
<span class="my-text">hello world</span>
</div>
물론 인라인 스타일을 사용하고 자신의 CSS 클래스로 대상을 지정할 수 없습니다. 그러나 이것은 복사 붙여 넣기 방식으로 작동합니다.
여기를 참조하십시오 :
버튼의 텍스트와 아이콘의 수직 정렬
그러나 그것이 나에게 달려 있다면 icon-2x를 사용하지 않을 것입니다. 다음과 같이 글꼴 크기를 직접 지정하십시오.
<div class='my-fancy-container'>
<span class='my-icon icon-file-text'></span>
<span class='my-text'>Hello World</span>
</div>
.my-icon {
vertical-align: middle;
font-size: 40px;
}
.my-text {
font-family: "Courier-new";
}
.my-fancy-container {
border: 1px solid #ccc;
border-radius: 6px;
display: inline-block;
margin: 60px;
padding: 10px;
}
실제 예제는 JsFiddle을 참조하십시오 .