본문 바로가기
반응형

▸티스토리 이야기81

타이틀 티스토리 꾸미기 | 말풍선 인용구 만들기 말풍선 인용구 만들기티스토리나 다른 블로그 플랫폼에서 '인용구'를 사용하는 이유는 주로 시각적 효과와 구조적 명확성 때문입니다. 시각적 구분: '인용구' 요소를 사용하면 '인용구'가 주변 내용과 시각적으로 구분되어 독자가 인용된 내용을 쉽게 식별할 수 있습니다. 이는 글의 가독성과 이해를 높여줍니다. 스타일링: 블로그 플랫폼에서는 주로 '인용구'에 대한 스타일을 지정하여 인용구를 강조하거나 시각적으로 더욱 눈에 띄게 만듭니다. 이는 인용된 내용에 대한 주목도를 높일 수 있습니다. 웹 표준 준수: HTML의 웹 표준에 따르면 인용된 텍스트를 나타내기 위해 '인용구' 요소를 사용해야 합니다. 티스토리나 다른 블로그 플랫폼에서 이를 준수함으로써 웹 사이트의 품질을 높일 수 있습니다. 따라서 티스토리나 다른 블.. 2024. 5. 8.
타이틀 티스토리 꾸미기 | 다양한 밑줄과 HTML 속성으로 텍스트 강조하기 다양한 밑줄 관련 text 태그의 종류 알아보기 오늘은 다양한 종류의 밑줄을 CSS 수정이 아닌 본문에서 태그를 이용해 HTML로 직접 넣어 주는 방법에 대해서 알아보겠습니다. 다소 복잡하고 난해한 설명이라 이런 게 있다는 정도만 알아두어도 블로그 작성에 도움이 될 수 있습니다. 기존의 획일적인 밑줄이 아니라 조금 더 강조하거나 특별하게 꾸미고 싶은 부분에 사용해 보세요. 참고한 블로그: 코딩에브리바디 (codingeverybody.kr) 다양한 HTML과 CSS, JavaScript까지 자세히 설명되어 있으니, 코드에 관심이 있으시면 꼭 한번 방문해 보시기 바랍니다. 텍스트 강조하기 폰트 크기 및 굵기로 강조하기 폰트의 크기와 굵기를 변경해 간단하게 텍스트를 강조할 수 있습니다. font-size:1e.. 2024. 4. 21.
타이틀 티스토리 소제목 꾸미기 | 서식(HTML) 모음, 그라데이션 스타일 티스토리 그라데이션 소제목(HTML) 서식 모음티스토리에서 소제목 서식을 사용하는 장점은 다음과 같습니다.시각적인 효과, 가독성 향상, 정보 전달 효과, 포스트 관리 용이성 등 포스트의 시각적 효과와 가독성, 정보 전달 효과 등을 향상하는 데 큰 도움을 줍니다. 웹서핑을 하다 보면, 제가 만든 소제목과 인용구 코드, 태그 속성 테이블, 그리고 오탈자까지 그대로 가져가 본인이 작성한 글인 것처럼 소제목 관련 포스팅을 하시는 분들이 계십니다. 코드를 퍼가는 것까지는 제가 막을 수 없지만, 제 자료를 사용해 소제목이나 인용구 등 관련 포스팅을 하실 경우, 출처를 꼭 밝혀 주시기 바랍니다.그 외 개인적인 사용은 자유롭게 하시면 됩니다. 티스토리 소제목 서식 저장하는 법1. 서식을 이용하려면 '블로그 관리 홈 >.. 2024. 3. 22.
타이틀 티스토리 북클럽 스킨 | 본문 상단 브레드크럼 옆에 URL 복사버튼 추가하기 목차 본문 상단 브레드크럼 옆에 URL 복사버튼 추가오늘은 본문 상단 '브레드크럼' 옆에 URL 복사버튼을 추가하는 방법과 '브레드크럼'을 설정하지 않았을 때 URL 복사버튼을 추가하는 방법에 대해 알아보겠습니다. URL 복사는 보통 상단의 주소창에서 바로 복사하거나 하단의 공감버튼 옆의 SNS 공유버튼에서 복사를 해도 되지만 본문 상단 제목 위에 URL 버튼을 만들어 줌으로써 좀 더 쉽게 게시물의 URL을 공유할 수 있도록 해줍니다. 항상 그렇듯 제 글이 설명이 길고 이미지가 많아 복잡해 보이지만 설명대로 하나씩 따라 하시면 쉽게 'URL 버튼'을 적용할 수 있으니 차근차근 따라 해 보시기 바랍니다. 본 내용은 제가 사용하는 '북클럽 스킨' 위주로 작성 되었습니다. URL 복사버튼 추가하기URL 복사버.. 2024. 3. 19.
타이틀 티스토리 꾸미기 | 인용구 따옴표 닫기 만들기 목차 인용구 따옴표 닫기 만들기 티 스토리의 인용구 따옴표의 경우 열림 따옴표만 존재하고 닫힘 따옴표가 존재하지 않는 것이 기본값입니다. 이 경우는 CSS 값을 추가해 줌으로써 아래처럼 따옴표 닫기를 만들어 줄 수 있습니다. 티스토리 꾸미기 따옴표 닫기 미리보기 티스토리 꾸미기 따옴표 CSS 추가하기 따옴표의 CSS를 추가하려면 먼저 CSS 탭으로 이동합니다. 1. '관리자 홈'에서 '꾸미기 > 스킨 편집 > html 편집 > CSS'로 들어갑니다. 2. 아래처럼 코드를 복사 후 CSS탭 맨 아래 넣어주고 '적용'을 눌러 마무리합니다. 3. CSS코드 복사하기. /* 인용구 닫기 따옴표 추가 코드 */ #tt-body-page blockquote[data-ke-style='style1']::after {.. 2024. 3. 15.
타이틀 티스토리 소제목 꾸미기 | 인용구 서식(HTML) 스타일 모음 티스토리 인용구 서식(HTML) 스타일 모음티스토리나 다른 블로그 플랫폼에서 '인용구'를 사용하는 이유는 주로 시각적 효과와 구조적 명확성 때문입니다. 시각적 구분: '인용구' 요소를 사용하면 '인용구'가 주변 내용과 시각적으로 구분되어 독자가 인용된 내용을 쉽게 식별할 수 있습니다. 이는 글의 가독성과 이해를 높여줍니다. 스타일링: 블로그 플랫폼에서는 주로 '인용구'에 대한 스타일을 지정하여 인용구를 강조하거나 시각적으로 더욱 눈에 띄게 만듭니다. 이는 인용된 내용에 대한 주목도를 높일 수 있습니다. 웹 표준 준수: HTML의 웹 표준에 따르면 인용된 텍스트를 나타내기 위해 '인용구' 요소를 사용해야 합니다. 티스토리나 다른 블로그 플랫폼에서 이를 준수함으로써 웹 사이트의 품질을 높일 수 있습니다. 따.. 2024. 3. 14.
타이틀 티스토리 소제목 꾸미기 | 두줄 소제목 서식(HTML) 스타일 모음 '두줄 소제목' 서식 스타일 모음.  티스토리에서 서식을 사용하는 장점은 다음과 같습니다.시각적인 효과, 가독성 향상, 정보 전달 효과, 포스트 관리 용이성 등 포스트의 시각적 효과와 가독성, 정보 전달 효과 등을 향상하는 데 큰 도움을 줍니다. 소제목 서식 사용법1. 서식을 이용하려면 '블로그 관리 홈 > 서식 관리자 > 서식 쓰기'로 들어갑니다.2. 기본 모드가 아닌 'HTML'로 작성합니다.3. 'HTML'로 작성 후 저장해 주면 됩니다. '두줄 소제목' HTML 코드테두리 스타일원하는 선 스타일을 'solid'라고 쓰여있는 부분에 바꿔 적으면 됩니다.직선네모 점선동그란 점선두줄선soliddasheddotteddouble 선 위치전체선왼쪽 선오른쪽 선위쪽 선아래쪽 선borderborder-leftb.. 2024. 3. 13.
타이틀 티스토리 북클럽 스킨 | 사이드바 카테고리 밑줄 넣기 및 마우스 오버 색상 변경 목차'북클럽 카테고리' 밑줄 넣기 및 마우스 오버 색상 변경이번에는 조금 밋밋해 보이는 티스토리 북클럽 사이드바의 카테고리에 밑줄을 넣는 방법과 마우스를 올렸을 때 밑줄 없이 색상이 변경되는 방법에 대해 알아보겠습니다. 적용 예제는 아래 미리보기를 참고하세요.미리보기 '북클럽 카테고리' 폰트 키우기먼저 작아 보이는 듯한 카테고리의 폰트를 아래처럼 조금 크게 만들어 줍니다. 카테고리 수정을 하려면 먼저 CSS 탭으로 이동합니다.1. '관리자 홈'에서 '꾸미기 > 스킨 편집 > html 편집 > CSS'로 들어갑니다.    2. Ctrl + F를 이용해 .sidebar .category ul li {를 검색 후 아래처럼 CSS코드를 수정하고 '저장'을 눌러 마무리합니다..sidebar .category ul.. 2024. 3. 7.
타이틀 티스토리 꾸미기 | 프로필 카드 꾸미기 및 삭제 방법 티스토리 '프로필 카드' 꾸미기 및 삭제 방법.티스토리 '프로필 카드'는 티스토리 블로그에서 사용자의 정보와 프로필을 간략하게 보여주는 작은 카드 형식의 UI를 말합니다. 이 카드는 블로그의 하단에 표시되며, 주로 사용자의 프로필 사진, 사용자명, 소개 문구 등을 보여줍니다.이를 통해 방문자들은 블로거에 대한 간단한 정보를 쉽게 파악할 수 있습니다.최근 '프로필 카드' 기능이 기존에 모바일 환경에서만 보이던 것을 업데이트를 통해 PC 환경에서도 보이도록 설정되었습니다. 업데이트된 '프로필 카드'가 내가 사용하고 있는 스킨과 어울린다면 크게 상관없지만 그러지 않으신 분들은 조금 꾸며보거나, 보이지 않도록 수정하는 것이 좋겠습니다. '프로필 카드' 꾸미기 미리보기.기존의 밋밋한 '프로필 카드'를 아래처럼 스.. 2024. 2. 29.
반응형

home