본문 바로가기 메뉴 바로가기

윈컴이의 컴퓨터 이야기

프로필사진
  • 글쓰기
  • 관리
  • 태그
  • 방명록
  • RSS

윈컴이의 컴퓨터 이야기

검색하기 폼
  • All (57)
    • Apple (9)
    • 블로그 (1)
    • 프로그래밍 (0)
    • 윈도우 7 (21)
      • 윈도우 7 팁 (12)
      • 윈도우 7 테마 (9)
  • 방명록

CSS 강좌 (5)
CSS 기초 강좌 - 9강. 안쪽 여백[padding]을 정해보자.

padding-toppadding-rightpadding-bottompadding-left안쪽 여백을 정할 수 있습니다. margin처럼 세부적으로 한 개씩 정할 수 있습니다. 예제) padding-top:10px; padding-right:2em; padding-bottom:100% padding-left:0 padding간단하죠. padding-top, padding-right 등을 모두 정할 수 있습니다. padding에 적는 갯수에 따라... padding:10px => 모든 안쪽 여백을 10px으로 padding:10px 5px => 상하 10px, 좌우 5px으로 padding:10px 5px 2px => 상 10px, 좌우 5px, 하 2px padding:1px 2px 3px 4px => ..

카테고리 없음 2012. 1. 8. 16:35
CSS 기초 강좌 - 8강. 바깥 여백[margin]을 정해보자.

margin은 안쪽 여백이 아니라 바깥 여백입니다.margin-topmargin-rightmargin-bottommargin-left바깥 여백을 정할 수 있습니다. 세부적으로 한개 씩 정할 수 있습니다. 예제) margin-top:10px; margin-right:2em; margin-bottom:100% margin-left:0 marginmargin-top, margin-right 등을 모두 정할 수 있습니다. margin에 적는 갯수에 따라... margin:10px => 모든 바깥 여백을 10px으로 margin:10px 5px => 상하 10px, 좌우 5px으로 margin:10px 5px 2px => 상 10px, 좌우 5px, 하 2px margin:1px 2px 3px 4px => 상 1..

카테고리 없음 2012. 1. 8. 16:29
CSS 기초 강좌 - 7강. CSS Box Model(박스모델)이란?

출처 : http://www.w3schools.com/css/css_boxmodel.asp 모든 HTML 요소는 박스로 생각하면 됩니다. CSS에서디자인과 레이아웃 얘기를 할 때, 용어 '박스 모델"이 사용됩니다. 박스 모델은 우리가 다른 요소와 관련 요소와 공간 요소 주위에 테두리를 삽입하실 수 있습니다.아래의 이미지는 상자 모델을 보여줍니다 Width(너비)와 Height(높이)는 어떻게 정해질까? width:250px; padding:10px; border:5px solid gray; margin:10px; 이렇게 CSS가 되어있다고 생각해보면, 너비는 아래와 같이 됩니다. 250px (너비) + 20px (왼쪽, 오른쪽 패딩) + 10px (왼쪽, 오른쪽 테두리) + 20px (왼쪽, 오른쪽 여백..

카테고리 없음 2012. 1. 7. 21:24
CSS 기초 강좌 - 6강. 알록달록 배경이미지를 지정해보자.

background-color : 배경색 지정 배경색을 지정하는 속성입니다. 색상 이름이나 코드 값을 넣을 수 있습니다. 예제) body {background-color:#eeeeee;} #wincomi {background-color:skyblue} background-image : 배경 이미지 지정 배경 이미지를 지정하는 속성입니다. 이미지 경로를 입력하시면 됩니다. 이미지 경로는 url(“~~”)로 입력합니다. 예제) body {background-image:url(“./images/wincomi_bg.jpg”);} background-repeat : 배경 이미지가 반복되는 방법 배경이 반복되는 방법을 지정하는 속성입니다. 아래 중 하나를 입력하시면 됩니다. 패턴일 경우에는 repeat을 쓰시면 됩..

카테고리 없음 2012. 1. 3. 22:24
CSS 기초 강좌 - 5강. Font 속성 : 글자 제어

혹시 예전에는 폰트를 설정하려면 이렇게 쓰시지 않으셨나요? Font 속성 물론 이렇게 쓰셔도 되지만, 웹 표준에 맞지 않습니다. CSS 기초 강좌 5강 - Font 속성 : 글자 제어 1. 글자 크기를 설정하는 속성 font-size:x x에는... pt - 글자크기를 포인트 단위로 표시 1포인트는 1/72인지이며 가장 많이 사용되는 단위 em - 기준 글꼴 문자의 높이를 기준으로 글꼴크기를 지정 % - 기준 글꼴 문자의 크기에 대한 %단위로 글꼴 크기를 지정 px - 글꼴의 크기를 픽셀 단위로 표시 2. 글자 두께를 설정하는 속성 font-weight:x x에는... normal - 아무것도 주지 않습니다. : 미리보기 bold, bolder - 굵게 : 미리보기 3. 글꼴을 설정하는 속성 font-f..

카테고리 없음 2011. 12. 30. 16:01
이전 1 다음
이전 다음
최근에 올라온 글
  • [Next.js] getStaticProps, g⋯
  • Vercel에 커스텀 도메인 연결하기
  • [Swift] IteratorProtocol
  • [Swift] 범위 연산자
최근에 달린 댓글
  • 이거 시작버튼이 않바뀌어요 어떻게 해요? 빠른 답변 주⋯
  • 너무 좋네요. 역시 원컴이님!^-^
  • 너무 좋아요!!! 감사합니다.
  • 낚시글인줄 알았는데 잘 되는군요. 다만 압축풀고 실행해⋯
글 보관함
  • 2022/12 (8)
  • 2016/11 (1)
  • 2016/08 (1)
  • 2016/07 (29)
  • 2014/09 (1)
  • 2014/05 (1)
Total
2,012,482
Today
14
Yesterday
24

Blog is powered by Tistory / Designed by Tistory

티스토리툴바