정보통신

TISTORY 폰트 관련 스타일을 적용할 수 있는 유용한 HTML 코드 5개

테크저널 2024. 5. 4. 21:26

 

1. 글자 크기 조정

 

<p style="font-size:24px;">
    큰 글자
</p>
<p style="font-size:14px;">
    작은 글자
</p>

 

사용법: font-size 속성을 사용하여 원하는 글자 크기를 지정하세요. px는 픽셀 단위로 크기를 지정합니다.

 

2. 글자 굵기 조정

 

<p style="font-weight:bold;">
    굵은 글자
</p>
<p style="font-weight:normal;">
    보통 글자
</p>
<p style="font-weight:lighter;">
    얇은 글자
</p>

 

사용법: font-weight 속성을 사용하여 글자의 굵기를 조정하세요. bold는 굵게, normal은 기본, lighter는 더 얇게 표시됩니다.

 

3. 글자 기울임

 

<p style="font-style:italic;">
    기울어진 글자
</p>
<p style="font-style:normal;">
    기본 글자
</p>

 

사용법: font-style 속성을 사용하여 글자의 기울임을 조정하세요. italic은 기울어진 글자를, normal은 기본 글자를 나타냅니다.

 

4. 글꼴 변경

 

<p style="font-family:'Arial', sans-serif;">
    Arial 글꼴
</p>
<p style="font-family:'Courier New', monospace;">
    Courier New 글꼴
</p>
<p style="font-family:'Times New Roman', serif;">
    Times New Roman 글꼴
</p>

 

사용법: font-family 속성을 사용하여 원하는 글꼴을 지정하세요. 여러 개의 글꼴을 쉼표로 구분하여 대체 글꼴을 설정할 수 있습니다.

 

5. 글자 색상 변경

 

<p style="color:red;">
    빨간색 글자
</p>
<p style="color:green;">
    초록색 글자
</p>
<p style="color:#00f;">
    파란색 글자
</p>

 

사용법: color 속성을 사용하여 글자의 색상을 지정하세요. 색상은 이름, RGB 값, 혹은 16진수 코드로 지정할 수 있습니다.

320x100
 

티스토리 간편 유용 HTML 모음 + 소제목 꾸미기 추천 글

1. 유튜브 영상 삽입https://www.youtube.com/embed/동영상ID" frameborder="0" allowfullscreen> 사용법: 동영상ID 부분에 삽입하려는 유튜브 동영상의 ID를 입력하세요.2. 구글 맵 삽입https://www.google.com/maps/embed?pb=!

tech-journal.tistory.com

 

티스토리 간편 유용 HTML 모음 추가 10개

11. 탭 기능     탭 1     탭 2     탭 1 내용     탭 2 내용 사용법: 탭을 여러 개 만들고 각 탭에 대한 내용을 tab-content 클래스 안에 추가하세요.12. 컬러 박스     컬러 박스 내용 사

tech-journal.tistory.com