테스트 사이트 - 개발 중인 베타 버전입니다

텍스트 코딩 이런건 어떻게 해야하나요? 채택완료

웹지기맨 7년 전 조회 2,545

아래 텍스트를 css로 코딩정의할려면 어떻게해야할지 감이 안오네요.;;

 

아래보다시피 검정색 글자로 시작해서 중간에 빨간색글 2개 들어가고 마지막 단어는 좀더 큰글자와 파란색 계열 글자색인데요.

 

 

고수님들 가르쳐주세요..

댓글을 작성하려면 로그인이 필요합니다.

답변 3개

채택된 답변
+20 포인트
herojd
7년 전

https://jsfiddle.net/pxn3rnha/7/" target="_blank">https://jsfiddle.net/pxn3rnha/7/

이런식으로 가능 합니다.

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

플래토
7년 전

</p>

<p><strong></p>

<p><span style="font-size:20pt"></p>

<p><span style="font-family:맑은 고딕">알면</p>

<p><span style="color:#e74c3c">받고</span></p>

<p>모르면</p>

<p><span style="color:#e74c3c">못받는</span></p>

<p></span></p>

<p></span></p>

<p> </p>

<p><span style="color:#3498db"></p>

<p><span style="font-size:24pt"></p>

<p><span style="font-family:맑은 고딕">&quot;격락손해&quot;</span></p>

<p></span></p>

<p></span></p>

<p></strong></p>

<p>

 

알면 받고 모르면 못받는 "격락손해"

 

위 내용은 에디터에 입력하고 

소스보기에서 긁은경우입니다.

글씨의 컬러는 각각 다르기때문에

css로 규칙을 만드시기보단 각각 적용하는게 나을수도 있습니다.

</p>

<p><style></p>

<p>.f {font-size:20pt;font-wieght:bold}</p>

<p>.r_font { color:red}</p>

<p>.b_font {color:blue;font-size:24pt}</p>

<p></style></p>

<p> </p>

<p><span class="f"></p>

<p>알면</p>

<p><span class="r_font">받고</span></p>

<p>모르면 </p>

<p><span class="r_font">못받는</span></p>

<p><span class="b_font">"격락손해"</span></p>

<p></span></p>

<p>

 

와 같이 하셔도 됩니다.

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

7년 전

간단하게 구현해봤습니다.

</p>

<p><style>

.content {font-size:20px; font-weight:bold}

.content > span:nth-child(2n) {color:red;}

.content > span:nth-child(5) {color:blue; font-size:26px}

</style>

<p class="content">

<span>알면</span> <span>받고</span> <span>모르면</span> <span>못받는</span> <span>"격락손해"</span>

</p></p>

<p>

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인