본문 바로가기

웹코딩 배우기/· CSS140

CSS 외부여백 margin 티스토리 스킨 편집하면서 지겹도록 봤던 태그다. m.a.r.g.i.n... 토 나온다. =-= 그러니 복습 삼아 정리만 하고 가자. margin은 컨텐츠의 외부 여백을 설정한다. margin은 상-우-하-좌 각각 값을 줄 수 있다. 보통 px; 단위를 사용하고 % 도 많이 사용한다. margin-top / 상 margin-right / 우 margin-left / 좌 margin-bottom / 하 margin은 위의 상-우-좌-하로 쓰지 않고 한번에 쓴다. margin: 0 0 0 0; / 상-우-하-좌 margin: 0 0 0; / 상-우좌-하 margin: 0 0; / 상하-우좌 margin: 0; / 상우하좌 margin: auto; / 가로 중앙 margin: inherit / 상위 속성을 받는.. 2019. 10. 28.
CSS 테두리 border css 테두리 태그를 알아보자. html에서 몇 번 해봐서 쉽다. 테두리 모양 border-style 2019. 10. 28.
CSS 배경 css 배경 이미지에 대해서 알아보자. 배경색은 기본이라 넘어간다. {background-color: 색;}으로 쓰면 배경색은 지정이 끝난다. 배경 이미지는 조금 알고 넘어가야 할 부분이 있어 정리해보자. .body { background-image: url("1234.png"); } 이미지 지정 방법은 기본 이렇다. 요소의 넓이 보다 이미지가 작으면 기본 반복으로 표현된다. 이미지 반복 설정 .body { background-image: url("1234.png"); background-repeat: repeat-x; } 이미지 가로 반복 설정. .body { background-image: url("1234.png"); background-repeat: repeat-y; } 이미지 세로 반복 설정. .. 2019. 10. 28.
CSS 색 css에서 색은 html 색과 99% 동일하다. 잠깐 살펴보고 넘어가면 될 것 같다. 닐기의 티스토리입니다. 배우고 싶은 공부를 주로 포스팅합니다. 영양가 없어서 죄송합니다만? 저한텐 중요한 자료들입니다. 닐기의 티스토리입니다. 배우고 싶은 공부를 주로 포스팅합니다. 영양가 없어서 죄송합니다만? 저한텐 중요한 자료들입니다. 색상에 대한 건 다음 글을 참고하자. 2019/10/12 - [웹코딩 어려워/· HTML] - HTML 색상 HTML 색상 html 색상은 색이름, rgb, hex, hsl, rgba, hsla 값을 사용한다. 파란배경 흰 글씨 nilgi.tistory.com 2019. 10. 28.
CSS 외부, 내부, 인라인 html에 css를 적용하는 방법은 3가지가 있다. 외부 css 파일을 링크걸어 불러와 적용하는 방법. html 문서의 head 내부에 넣는 방법. html 요소 자체에 넣는 방법이 있다. 조금 더 자세하게 알아보자. 외부 css 외부 css 파일만 변경하면 html 문서 전체에 적용이 된다. 티스토리 스킨 편집이 이러한 경우다. 이렇게 외부 파일이 연결되 있다. 외부 파일은 "이름.css" 확장자 css로 저장해야 한다. 내부 css 내부 css는 2019. 10. 26.
CSS 요소 선택 css를 html의 요소를 선택해서 꾸미는 게 기본이다. 이전 과정에서 .nilgi {color: gold; font-size: 20px;} 이렇게 쓰는 거다라고 배웠다. 여기에서 앞 ".nilgi" 이 부분에 대해서 알아보자. html 요소를 선택하는 방법에는 5가지가 있다. 많기도 하다. 그러나 결국 1가지다. =-=? id > # html에서 id 요소를 선택한다. html에 nilgi라는 id를 가진 div 블록이 있다. id 이름은 자기 마음대로다. #nilgi {display: block;} 이렇게 id를 선택할 때는 이름 앞에 "#" 을 쓴다. id에 관한 건 다음 글을 참고해 주세요. 2019/10/15 - [웹코딩 어려워/· HTML] - HTML id="" HTML id="" id는 이.. 2019. 10. 26.
CSS 기본 / 주석 css를 쓰는 방법을 배우자. 기본적인 규칙과 주석 태그를 쓰는 방법. css를 쓰는 기본 방법 css 주석 태그 css도 html 처럼 주석 태그가 있다. 주석 태그는 태그를 설명하거나 시작과 끝을 알리는 데 사용한다. /* 내용 */ ← 이렇게 쓴다. 주석 태그는 화면에 표시 되지 않으며 닫는 태그는 따로 없다. 나는 /* 내용 시작 */ 이렇게 시작을 알리고 /* 내용 끝 */ 이렇게 쓰고 있다. css 주석 태그를 빨리 쓰는 방법은 오른쪽 숫자 키패드 num 키 옆에 보면 '/', '*'가 같이 있다. 빠르게 눌러주자. 타닥타닥! 참고로 html 주석은 이렇게 사용한다. 2019. 10. 26.
CSS란? html 태그 대~~~충 마무리하고 css로 넘어왔다. 요즘 컨디션이 안 좋아서 아무것도 하기 싫다. 가을 타나보다. 정신 차리고 싶은데 힘들다. 그래서 대책을 마련했다. 천천히 하기로 한다. 천천히가 어느 정도냐면 인생이 1배속이라면 0.1배속으로 하려 한다. 가을 타나보다. =-= 건들지 마라. css는 html 문서의 스타일을 정의하는 언어다. css는 인라인, 내부, 외부 3가지 방법으로 적용할 수 있다고 한다. 인라인은 요소 자체에 style을 지정하는 거고 내부는 head 사이에 style을 넣는 거고 외부는 링크를 통해 css를 불러오는 방법이다. 티스토리 스킨 편집에는 3가지 방법 모두 쓰이는 것 같고 주로 외부 링크를 쓴다. 스킨 편집 css가 그것이다. Cascading Style Sh.. 2019. 10. 26.