Programing

CSS에서 첫 번째 문자를 대문자로 만듭니다.

lottogame 2020. 4. 11. 09:39
반응형

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-letter이 중 하나 여야합니다, 그래서 선택은 인라인 요소하지 작업을 수행 block하거나 inline-block같은 다음 :

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

CSS : 첫 글자 선택기

또는 :

text-transform: capitalize;

나는 사용하는 것이 좋습니다

#selector {
    text-transform: capitalize;
}

또는

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

그건 그렇고,이 w3schools 링크를 확인하십시오 : 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>

먼저 소문자로 만드십시오.

.m_title {text-transform: lowercase}

그런 다음 첫 글자를 대문자로 만드십시오.

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

한마디로 "텍스트 변환 : 대문자 화"가 작동합니다. 그러나 여러 단어를 원한다면이 솔루션은 완벽합니다.


CSS에서 다음 코드를 사용하는 것이 좋습니다.

    text-transform:uppercase; 

수업에 넣었는지 확인하십시오.

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

반응형