본문 바로가기
티스토리

[티스토리] 티꾸! 티스토리꾸미기 css스타일용어, width, height 알아보기!

by 꼬마꼬마 2024. 10. 25.
반응형

▼※ 모든 글과 사진은 직접 촬영 및 작성하였습니다. (직접 작성이 아닌 경우에는 출처명시)

▷ 무단복제 및 저장, 공유 금지🚫

▶ 무분별한 신고나 악의적인 신고❌(신고 시 , 맞신고 함)

▷ 악의적인 목적의 댓글, AI댓글 금지🚫

▶ 불법적인 인용 금지🚫

적발 시, 즉시신고⚠️

 

더 자세히 보러 가기▼

오늘은 티스토리 블로그를 하다 보면 꼭 한 번은 html설정과 css설정을 하게 되고

css설정(수정)을 하게 되면 반드시 한 번은 보게 되는 바로 'width'와 'height'!

아마, 많이들 보셨던 용어일 거라 생각됩니다!! 저도 수정할 때마다 꼭 보게 되거든요!

 
 

여기서 주의⚠️

저는 블로그 상태와 성능검사에서 점수가 특히나 많이 떨어진 경우라, 다시 올리기 위해

여러 번, 수정작업을 거치고 있으나 지나친 수정작업은 오히려 블로그에 해가 될 수도 있다고 하니

모두 주의해 주세요! 반드시 필요한 경우가 아니라면 수정은 가능한 피하는 게 더 좋을 것 같아요!

저도 이전 스킨 사용하면서 수정을 거의 매일 해왔더니 조회수도 훅! 떨어지고... 물론..! 

그 이유야 다른 곳에서 큰 부분이 있었지만요! 그래도 지나치게 수정을 하는 날이면

평소보다도 더 조회수가 떨어지더라고요! 이점 꼭 유의해주세요!

width? 위더스?

width란, 무엇인가! 

시간 끌지 않고 바로 알려드릴게요!

/* css 예시 */
body.
font-family: Mono;
width: 15px
hegiht: 10px
margin: 0, 0

 

이렇게 css수정하게 되면, 바로 보게 되는 'width' 

바로, '너비'입니다.

너비가 15px(픽셀)로 지정되어 있다는 거죠!

 

이 너비는 간격이 어느 정도로 넓나? 라는 넓이가 아니라, 길이가 어느정도 긴가(넓나)?라고

생각하시면 될 것 같아요!

 

아주 쉽게 가자면, '가로길이'라고 보시면 될 것 같아요!

간격은 'margin', 'padding'을 이용하여 지정한답니다! 

이 두 가지에 대해서도 조만간 올려두겠습니다!

반응형

height는 무엇인가?

자 다음으로는 'height'에 대해서 알아보도록 해요!

/* css 예시 */
font-wegiht: blod;
font-height: 10px
color: #000000

 

height, 보이시나요!? 이 용어의 의미는 '높이'입니다!

'어디 높이가 몇 cm인가.....'가 아니라, 세로의 길이를 말하는 겁니다! 

티스토리에서는 물건이 아니니  cm를 알아보지는 않으니까요!

 

이번 예시를 보면 'font-height'이라고 되어있는데

저건 잘못된 표기입니다! 정확한 표기는 'line-height'입니다!

바로 텍스트 줄의 높이입니다!  픽셀이 높아지면 높아질수록 윗글과 아랫글사이의 간격이 넓어져요!

밑에 예시를 보면,

 

ex) 안녕하세요, 꼬마블로그입니다.

 

      안녕하세요, 꼬마 블로그입니다.

 

처럼, 문단사이의 간격에 변화가 생깁니다!

 

만약 폰트의 높이 픽셀이 높으면 높을수록 글씨가 늘어나지 않을까요? ㅋㅋㅋ

늘어나게 되면 글씨의 크기가 커졌다고 느껴질 수도 있어요! ㅋㅋㅋㅋㅋ

폰트의 크기는 'font-size'로 지정하는 겁니다!!

 

저처럼 티스토리 블로그를 처음 접하시는 분들을 위해 기본용어들을

하나씩 하나씩 공부하고 배워서 올리는 중입니다!

 

오늘도 읽어주셔서 감사합니다!!

 

글 양식 및 사진, 영상 등 모든 콘텐츠의 무단복제를 금지합니다.

copyright © 2024. kkoma. All rights reserved.

반응형

최근댓글

최근글

skin by © 2024 ttuttak