잉고래의 잇다이어리

CSS 구문구성 지난 'CSS가 없던 시절의 문제' 글에 이어서 이번 글에서는 CSS가 어떻게 구성이 되는지 알아보자. CSS의 규칙은 선택자(Selector)와 선언 블록(declaration block)으로 구성된다.첫번째 선택자는 HTML의 나 태그 같은 스타일을 지정할 HTML 태그나 클래스, ID 등을 가리킨다. 두번째 선언블록은 하나 이상의 선언들 모음을 말하는데, 블록 안의 각 선언들은 세미콜론(;)으로 끝마치거나 구분되고 시작과 끝은 중괄호({ })로 둘러싸여진다. 그럼 이제 선언 블록 안의 각각의 선언들은 어떻게 구성이 되어지는지 알아야 할 것이다. 개별적인 선언(declaration)은 속성(Property)과 값(Value)으로 구성된다. 속성이란건 어떤 요소에 대한 속성을 말한다. ..

CSS란 무엇인가? CSS는 Cascading Style Sheets의 약자이다. 한글로 하면 '계단식 양식 문서들' 이란 어색한 해석이 된다. 왜 이런 이름이 지어 졌는지 궁금하면 지난 포스팅 글인 'CSS는 왜 Cascading Style Sheet일까?'를 참고하도록 하자. CSS는 다음의 특징들을 갖는다. CSS는 HTML 요소를 화면, 종이 또는 다른 매체에 표시하는 방법을 설명한다. CSS는 많은 작업을 저장하여, 한 번에 여러 웹 페이지의 레이아웃을 제어 할 수 있다. HTML 내부에 삽입된 CSS가 아닌 외부 스타일 시트는 CSS 파일에 저장된다. CSS를 어디에 쓰지? CSS는 디자인, 레이아웃 및 다양한 장치 및 화면 크기에 대한 디스플레이의 변형을 포함하여 웹 페이지의 스타일(양식)을..

티스토리 스킨 변경하는데 뭐가 이리 어려운지. 모르는게 너무 많다. 일단 css를 제대로 알아야 겠다는 생각이 들어서 처음부터 공부해 보기로 맘 먹었다. 막상 시작 지점으로 와서 보니 내가 css란 용어도 잘 몰랐구나 하고 깨닫게 된다. css란게 cascading style sheets의 약자인데, 한글로는 폭포식, 계단식 스타일 시트 이런식으로 번역 된다. 처음 단어부터 잘 와닿지 않는 뜬금없는 폭포식, 계단식이란 용어 때문에 왜 이런 명칭이 붙게 되었을까?하고 의구심이 든다. 여기에는 사연(?)이 당연히 있다. html의 계층적 구조에는 각각의 태그들이 존재한다. 이런 태그들을 꾸미는 것이 스타일이고 이렇게 꾸며진 각 태그마다의 스타일은 상위에서 하위로 상속이 되면서 각 스타일들이 누적되어지면서 가..

티스토리 댓글 버튼 스킨 바꾸기 티스토리 블로그 스킨을 변경하기 시작한지 오늘로 9일인지, 10일인지 되네요. 시작하기 전에는 지루하고 힘든 작업이 될거라 생각했었는데, 막상 해보니 생각보다 재밌네요. 하나 하나 바꿔나가는 과정을 보고 있노라니 나름 화초 키우는 기분입니다. 오늘은 댓글 입력창 옆에 있는 '입력버튼' 모양을 바꿔봤습니다. 예전에 이미지 버튼으로 만들어서 넣었는데 지금보니 가독성도 떨어지고 이걸 왜 해놨지 싶더라고요. 댓글 버튼 치환자 스킨 바꾸는 과정은 그리 어렵지 않습니다. 관리자 모드의 html 코드에서 치환자 '_rp_onclick_submit_'를 찾습니다. 그런다음 해당 태그에 대해 css에서 사용할 id 또는 class를 지정해 줍니다. 간단히는 여기까지만 해도 HTML 수정은..