새 Tumblr 블로그를 만들면 시스템에서 조정할 수있는 설정이 포함 된 기본 템플릿을 생성합니다. Tumblr가 지적했듯이 이러한 유연성은 블로그 페이지를 더 매력적으로 선택하고 개인적인 터치를 제공 할 수있는 기능을 제공합니다. HTML을 이해하지 못하는 경우에도 템플릿에 간단한 업데이트를 적용하여 텍스트 게시물의 제목을 돋보이게 만들 수 있습니다.
웹 페이지 스타일링 101
웹 사이트 소유자는 Cascading Style Sheet 특성과 값을 코드에 추가하여 웹 페이지의 모양을 변경합니다. 예를 들어 색상 속성의 값은 개체의 색상을 결정합니다. 사람들은 background-color 속성을 사용하여 배경을 채색합니다. font-size 속성을 사용하여 텍스트 요소의 글꼴을 변경할 수도 있습니다. 하나 이상의 CSS 속성을 Tumblr 블로그의 HTML 코드에 적용하여 해당 요소를 사용자 정의 할 수 있습니다.
템플릿 코드 찾기
Tumblr 대시 보드를 방문하여 "사용자 지정"을 클릭하면 테마 사용자 지정의 왼쪽 패널에서 "HTML 편집"을 클릭하여 HTML 편집기를 열 수 있습니다. 'HTML 편집'이 표시되지 않으면 패널 상단으로 스크롤하여 찾습니다. 페이지가 열리면 "Ctrl-F"를 누르고 검색 상자에 "post .title"(따옴표 제외)을 입력합니다. 편집기는 "#wrapper #content .post .title {."이라는 코드 줄로 이동합니다.
HTML 스타일 지정
찾은 코드 줄 뒤에 추가하는 CSS 속성은 게시물 제목의 모양을 결정합니다. "color : red; background-color : yellow; text-decoration : underline;"을 붙여 넣어 테스트합니다. 그 줄 뒤에. 따옴표를 사용하지 마십시오. 이 세 가지 속성은 게시물 제목의 색상, 배경색 및 텍스트 장식을 빨간색, 노란색 및 밑줄로 변경합니다. "미리보기 업데이트"를 클릭 한 다음 "저장"을 클릭하고 Tumblr 대시 보드 페이지를 방문하세요. 프로필 이미지를 클릭하면 다른 사람과 마찬가지로 블로그 페이지가 표시됩니다. 제목이있는 게시물에는 추가 한 새 속성이 표시됩니다.
블로그를 최신 상태로 유지
제목 텍스트의 스타일을 다르게 지정하고 싶을 때마다 CSS 속성 값을 변경하십시오. 예를 들어, 언젠가 빨간색 배경에 녹색 텍스트를 원하면 기존 색상을이 두 색상으로 변경합니다. 밑줄을 윗줄, 줄 넘김 또는 없음으로 바꿀 수도 있습니다. 글꼴 크기도 변경하려면 추가 한 코드 끝에 "font-size : 22px"를 붙여 넣으십시오. 따옴표를 사용하지 마십시오. 22를 텍스트에 사용할 픽셀 크기로 바꿉니다. 이 예에서 크기는 22 픽셀입니다. 값이 클수록 텍스트가 커지고 값이 작을수록 텍스트가 작아집니다. 블로그 스타일을 지정하는 데 사용할 수있는 다른 색상의 이름을 보여주는 W3Schools.com과 같은 사이트를 방문하십시오 (참고 자료의 링크).
