굴리고 굴리는 블로그

vw(viewport width) : 뷰포트 폭 (1vw : 뷰포트 폭의 1%) (100vw : 뷰포트 폭의 100%) vh(viewport height) : 뷰포트 높이 1vmin : 1vw 혹은 1vh 중 작은값을 기준으로 1vmax : 1vw 혹은 1vh 중 큰값을 기준으로 1vw vw는 viewport width의 약자입니다. vw를 이해하기 위해 %와 먼저 비교해보겠습니다. p태그 스타일에 width:100%; 로 지정하면 부모인 body가 만들어준 공간의 100%를 사용한다는 뜻입니다. 여기서 body는 고유의 margin값을 가지고 있으므로 이 margin값을 일부러 없애지 않는다면 양 옆에 살짝 공간(body의 margin값)이 있을 것입니다. 하지만, vw는 부모가 만들어준 공간을 고려하..

CSS 문법을 최근에 열심히 배우고 있습니다. 오늘 배운 내용도 잊어버리기 전에 얼른 기록해놓고 반복해보아야겠습니다. 기록은 기억의 어머니이까요! CSS는 html로 제작한 웹페이지를 화려하게 꾸며줄 수 있는 언어입니다. 화려하게 꾸미기 위해서는 style시트에 많은 줄의 코딩을 해주어야 하는데요. 몇 줄 안되는 코딩이라면 쉽게 수정할 수 있겠지만, 줄수가 늘어나면 늘어날 수록 작업하고 수정하는 것이 쉽지 않게 될 것입니다. 특히, font-size나 width와 같이 폰트크기나 문단 너비, 높이 등을 지정할 때는 줄 수가 많을 수록 헷갈릴 수 있습니다. 그래서 특히나 처음 CSS 스타일을 짤 때 단위부터 확실하게 체계를 잡아놓고 시작해야겠네요. CSS에서 사용되는 단위에는 px, %, em, rem 단..

아래 메모장 파일을 열어 위 소스를 복사하세요! 티스토리 특정 글만 마우스 우클릭 금지, 마우스 드래그 금지하려는 경우 1. 티스토리 글쓰기에서 아래처럼 작성모드를 "기본모드"에서 "HTML모드"로 바꿉니다. 2. html모드에서 맨 위나 맨 아래에 위의 코드를 넣어주시면 됩니다. 티스토리 모든 글에 마우스 우클릭 금지, 마우스 드래그 금지하려는 경우 1. [티스토리 설정] → [스킨편집] → [html편집] 으로 들어갑니다. 2. 밑에, 즉 head가 끝나고 body가 시작되는 부분부터 아무 곳에나 위 코드를 붙여넣으시면 됩니다. 블로그와 같은 인터넷 공간에 글과 그림, 사진과 같은 창작물들을 게재시 저작권 보호와 무단 복제 방지를 위해 마우스 우클릭이 안되게 금지하거나 마우스 드래그가 안되게 금지된 ..

인터넷으로 기사나 각종 블로그의 글들을 볼 때 우리는 무의식적으로 글씨들을 드래그 하면서 읽습니다. 무의식적으로 좀 더 글씨를 잘보기 위해 하는 행동이죠. 이 때 대부분의 사이트는 아래 처럼 푸른색 바탕에 흰색글씨로 나타나기 마련입니다. 하지만 지금 보시는 제 블로그는 글씨들을 드래그 해 보시면 노란색 바탕에 검정글씨로 나타나고 있습니다. 이는 간단한 CSS 언어를 적용시켰기 때문입니다. 누구나 쉽게 따라하실 수 있으시니, 이 기능을 찾던 분들은 한 번 보시고 바로 적용해보세요! HTML과 CSS로 직접 블로그를 입맛대로 수정할 수 있는 티스토리를 기준으로 설명드리겠습니다. 1. 일단 소스는 아래와 같습니다. CSS를 아시는 분들은 아래 소스를 붙여 넣으시면 됩니다. ::selection { color:..