본문 바로가기
반응형

It66

[html/css]background-attachment 속성(배경이미지 고정) [html/css]background-attachment 속성(배경이미지 고정) 차례 : background-image background-repeat background-attachment background-position background-size background 배경이미지를 넣을 때는 background-image 속성, 배경이미지 패턴을 선택할 때는 background-repeat 속성을 배웠습니다. (위에 링크 참조) 오늘은 배경 이미지를 어떻게 고정할지 결정하는 background-attachment 속성입니다. background-attachment 속성 : 배경 이미지 고정 방식 ▶속성값 scroll 기본값으로, 이미지가 요소에 상대적인 위치. fixed 이미지가 윈도우 창에 상대적.. 2014. 5. 23.
[html/css] background-repeat 속성(배경 이미지 패턴) [html/css] background-repeat 속성(배경 이미지 패턴) html 문서에 배경 이미지를 넣는 속성에 대해 배워 보고 있습니다. 어제는 background-image 속성으로 배경 이미지를 넣는 방법을 배웠습니다 글자색 color 속성, 배경색 background-color 속성 배우기 배경 이미지를 넣는 background-image 속성 오늘은 배경 이미지를 넣을 때 어떤 패턴으로 넣을지 선택하는 속성 background-repeat 입니다. 차례 : background-image background-repeat background-attachment background-position background-size background background-repeat 속성 backgr.. 2014. 5. 22.
[html/css]배경 이미지를 넣는 background-image 속성 [html/css] 배경 이미지를 넣는 background-image 속성 사용법 어제는 배경색을 넣을 때 background-color 속성을 사용한다고 배웠습니다. 글자색 color 속성, 배경색 background-color 속성 배우기 오늘부터 차례대로 배경 이미지와 관련된 속성을 배워보겠습니다. 차례 : background-image background-repeat background-attachment background-position background-size background background-image 속성 background-image는 배경 이미지를 넣을 때 쓰는 속성입니다. 어떤 요소에 배경 이미지를 넣으면 padding을 포함하여 배경을 채우게 됩니다. (margin은 제외.. 2014. 5. 21.
[html/css] 글자색 color 속성, 배경색 background-color 속성 배우기 [html/css] 글자색 color 속성, 배경색 background-color 속성 배우기 지난 주에 글꼴을 지정하는 font 속성을 배우면서, 글꼴 색상은 어떻게 하지? 궁금해하시는 분들 계실 것 같아요. 글꼴을 지정하는 font 속성 배우기 글꼴 크기를 지정하는 font-size 속성(px, pt, %, em 차이) font-family 속성(serif, sans-serif차이) 오늘 배울 부분은 color 속성과 background-color 속성입니다. background-color은 배경색, color는 전경색(글자색 등)을 지정 합니다. 자세히 알아보겠습니다~ ▶background-color 속성 요소의 배경색을 지정하는 속성입니다. padding, border를 포함하여 색칠되고요. 단 .. 2014. 5. 20.
@font-face 사용규칙(eot, woff, otf/ttf, svg/svgz 차이) @font-face 사용규칙(eot, woff, otf/ttf, svg/svgz 차이) 지난 시간엔 태그와 @import로 외부 자원으로 연결하거나 글꼴을 이용하는 방법을 배웠습니다. 외부 문서를 연결하는 link 태그 사용법 @import rule 사용법, link 태그와 차이 글꼴을 지정하는 font-family 속성(serif, sans-serif차이) 오늘은 @font-face 규칙을 이용하려 웹폰트를 이용하는 방법입니다. @font-face 사용법 @font-face는 글꼴 파일을 html에 속에 삽입하여 사용자 컴퓨터에 설치되지 않은 글꼴을 서버에서 내려받아 사용할 수 있는 방법입니다. 사용 예 ☞ *나눔고딕을 한글과 영문으로 적은 것은 영문이름을 인식하지 못하는 브라우저에 대비하여 *한글 글.. 2014. 5. 19.
@import rule 사용법, link 태그와 차이 @import rule 사용법, link 태그와 차이 어제는 외부 문서나 자원를 연결하는 태그에 대해 알아 보았습니다. 외부 문서를 연결하는 link 태그 사용법 복습하는 의미에서, link 태그는 주로 다음 기능을 하는데요 -외부 스타일 시트 연결(css나 javascript 파일 등) -사용자 컴퓨터에 없는 글꼴을 지원하는 웹 폰트로 연결 이러한 기능은 @import 규칙을 통해서도 똑같이 구현이 가능합니다. 사용 예 @import rule 사용법 1. 구문 @import url(' '); 또는 @import " "; * 인용부호는 쌍따옴표, 홑따옴표 모두 가능 * 인용부호 안에 주소를 입력합니다 2. @import 규칙은 css 파일 맨 처음 위치합니다. *티스토리의 경우 관리 화면 html/css.. 2014. 5. 16.
[html/css]외부 문서를 연결하는 link 태그 사용법 [html/css]외부 문서(css)를 연결하는 link 태그 사용법 며칠 전 font-family 속성을 다루면서 [html/css] 글꼴을 지정하는 font-family 속성(serif, sans-serif차이) 외부 스타일시트를 연결하는 태그에 배웠었죠. 오늘은 태그에 대해 상세히 알아보겠습니다. 태그 이름에서도 알 수 있듯이, 태그는 외부의 문서를 연결시키는 태그입니다. 주로 css파일 같은 스타일시트 파일을 연결하거나, 웹 폰트를 사용할 때 폰트가 있는 주소로 연결시킬 수도 있습니다. ▶ 태그 사용법 - 태그는 사이에 넣습니다. - 여러 태그를 삽입할 수 있습니다. - html에서 닫는 태그는 없지만, xhtml에서는 아래처럼 닫습니다. ▶link 태그와 함께 사용할 수 있는 속성 1. href.. 2014. 5. 14.
티스토리 4개월 하며 느낀 점(순수 VS 수익형 블로그) 티스토리 4개월 하며 느낀 점 1일 1포스팅에 대하여 며칠 티스토리를 안 하다 보니 몸과 맘이 편하네요.. ^ ^ 최근 한 달 동안 1일 1포스팅을 되도록 지키려고 노력했습니다 하루에 글 하나 쓰는 게 뭐 어려운 일인가 싶지만, 제 일과 병행하려니 생각만큼 쉽지 않더라고요 1일 1포스팅을 하려고 했던 이유는, 블로그 업데이트 주기가 검색 순위에 영향을 미친다는 글을 읽은 후인데요 여유가 된다면 못할 것도 없지만, 촉박하게 품질 낮은 글을 생산하는 것보다 이틀에 한 번이라도, 양질의 글을 쓰는 게 더 좋다는 생각이 듭니다. 장기적으로 보았을 때 방문하는 사람이나 제 블로그가 오래 갈 수 있는 방법이 무엇인가 생각해 보면 그런 결론이 나옵니다. 글의 주제 티스토리를 처음 시작할 때, 블로그 이름은 이라고 붙.. 2014. 5. 12.
[html/css] 글꼴을 지정하는 font-family 속성(serif, sans-serif차이) [html/css] 글꼴을 지정하는 font-family 속성(serif, sans-serif차이) css에서는 원하는 글꼴을 지정할 때 font-family 속성을 사용합니다. 사용 예: p{ font-family; arial, 바탕체, "Times New Roman", Serif; } font-family 속성 font-family은 우리말로 번역하자면 글꼴 집합인데, 여러 개의 글꼴을 모아놓은 것이라고 보시면 됩니다. 만일 글꼴을 하나만 지정하면, 사용자의 컴퓨터에 그 글꼴이 없을 때는 기본값으로 표시가 됩니다. font-family은 다시 family-name과 generic family로 나누어집니다 family-name : 글꼴 이름 arial, verdana,나눔고딕, 궁서, 굴림 등 gen.. 2014. 5. 10.
[html/css]글꼴 크기를 지정하는 font-size 속성(px, pt, %, em 차이) [html/css]글꼴 크기를 지정하는 font-size 속성(px, pt, %, em 차이) css에서는 글꼴 크기를 지정할 때 font-size 속성을 사용합니다. 사용 예 p {font-size: 1em; } [html/css] 글꼴을 지정하는 font 속성 배우기 속성값은 다음과 같습니다. 절대값 : 고정된 크기. 장치에 따라 크기를 조절할 수 없음. px, pt, cm 등의 단위로 지정하거나 xx-small, x-small, small, medium, large, x-large, xx-large 중에서 선택 medium은 기본값으로 12pt=19px=13m=100% *구 IE 버전의 경우, small이 기본값이라 doctype을 선언해주어야 medium이 기본값으로 나옵니다 DOCTYPE 선언하.. 2014. 5. 9.
반응형