programing

CSS에서 첫번째 문자 대문자 만들기

oldcodes 2023. 9. 6. 22:16
반응형

CSS에서 첫번째 문자 대문자 만들기

CSS에서 레이블의 첫 번째 문자 대문자를 만드는 방법이 있습니까?

다음은 나의 HTML입니다.

<a class="m_title" href="">gorr</a>
<a class="m_title" href="">trro</a>
<a class="m_title" href="">krro</a>
<a class="m_title" href="">yrro</a>
<a class="m_title" href="">gwwr</a>

이를 위한 재산이 있습니다.

a.m_title {
    text-transform: capitalize;
}

링크가 여러 단어를 포함할 수 있고 첫 단어의 첫 글자만 대문자로 사용하려면 다음을 사용합니다.:first-letter대신에 다른 변신으로 (비록 중요하지는 않지만).주의할 것은 다음과 같습니다.:first-letter일을 시키다a요소는 블록 컨테이너여야 합니다(이는 가능합니다).display: block,display: inline-block, 또는 하나 이상의 속성의 다양한 다른 조합):

a.m_title {
    display: block;
}

a.m_title:first-letter {
    text-transform: uppercase;
}

참고하세요.::first-letterselector는 인라인 요소와 함께 작동하지 않으므로 다음 중 하나여야 합니다.block아니면inline-block, 다음과 같이

.m_title {display:inline-block}
.m_title:first-letter {text-transform: uppercase}

CSS : 첫 글자 선택기

또는:

text-transform: capitalize;

먼저 소문자로 바꿉니다.

.m_title {text-transform: lowercase}

그럼 첫 글자 대문자로 해주세요.

.m_title::first-letter {text-transform: uppercase}

"text-signal: capitalize"는 단어에 적합하지만 문장에 사용하고 싶다면 이 솔루션이 완벽합니다.

예:

.m_title {
  display: inline-block; /* Thanks to Fanky (https://stackoverflow.com/users/2095642/fanky) */
  
  text-transform: lowercase
}

.m_title::first-letter {
  text-transform: uppercase
}
<a class="m_title" href="">gorr</a>
<a class="m_title" href="">trro trro</a>
<a class="m_title" href="">krro</a>
<a class="m_title" href="">yrro</a>
<a class="m_title" href="">gwwr gwwr gwwr</a>

사용할 것을 제안합니다.

#selector {
    text-transform: capitalize;
}

아니면

#selector::first-letter {
    text-transform: uppercase;
}

참고로, 이 w3wlink: http://www.w3schools.com/cssref/pr_text_text-transform.asp 를 확인해보세요.

<script type="text/javascript">
     $(document).ready(function() {
     var asdf = $('.capsf').text();

    $('.capsf').text(asdf.toLowerCase());
     });
     </script>
<div style="text-transform: capitalize;"  class="capsf">sd GJHGJ GJHgjh gh hghhjk ku</div>

CSS에서 다음 코드를 사용하는 것을 권장합니다.

    text-transform:uppercase; 

수업시간에 꼭 넣어주세요.

반응 네이티브에서도 작동:

    textTransform: 'capitalize'

언급URL : https://stackoverflow.com/questions/5577364/make-the-first-character-uppercase-in-css

반응형