연습장

https://poiemaweb.com/css3-inheritance-cascading CSS3 Inheritance & Cascading | PoiemaWeb상속이란 상위(부모, 조상) 요소에 적용된 프로퍼티를 하위(자식, 자손) 요소가 물려 받는 것을 의미한다. 상속 기능이 없다면 각 요소의 Rule set에 프로퍼티를 매번 각각 지정해야 한다. 하지만poiemaweb.com   1. 상속(Inheritance) 상속이란 상위(부모, 조상) 요소에 적용된 프로퍼티를 하위(자식, 자손) 요소가 물려 받는 것을 의미한다. 상속 기능이 없다면 각 요소의 Rule set에 프로퍼티를 매번 각각 지정해야 한다. 하지만 모든 프로퍼티가 상속되는 것은 아니다. 프로퍼티 중에는 상속이 되는 것과 되지 않는 것이 있..

https://poiemaweb.com/css3-float CSS3 Float | PoiemaWebfloat 프로퍼티는 주로 레이아웃을 구성할 때 블록 레벨 요소를 가로 정렬하기 위해 사용되는 중요한 기법이다. flexbox 레이아웃를 사용한다면 더욱 간단하게 정렬을 구현할 수도 있지만 flexbox 레poiemaweb.com   float 프로퍼티는 주로 레이아웃을 구성할 때 블록 레벨 요소를 가로 정렬하기 위해 사용되는 중요한 기법이다. float 프로퍼티는 본래 아래 예제와 같이 이미지와 텍스트가 있을 때, 이미지 주위를 텍스트로 감싸기 위해 만들어진 것이다.   style>    img {      float: left;      margin-right: 10px;    }  style>  flo..

https://poiemaweb.com/css3-position CSS3 Position | PoiemaWebposition 프로퍼티는 요소의 위치를 정의한다. top, bottom, left, right 프로퍼티와 함께 사용하여 위치를 지정한다.poiemaweb.com 1. position 프로퍼티 position 프로퍼티는 요소의 위치를 정의한다.static (기본위치)relative (상대위치)absolute (절대위치)fixed (고정위치)+ top, bottom, left, right 프로퍼티와 함께 사용하여 위치를 지정한다. 1. static은 기본값이며 이미 설정된 position을 무력화하기 위해 사용될 수 있다. 2. relative 기본 위치(static으로 지정되었을 때의 위치)를 기..

https://poiemaweb.com/css3-font-text    1. font-size 프로퍼티텍스트의 크기를 정의한다. style>    .font-size-40 { font-size: 40px; }    .font-size-2x { font-size: 2.0em; }    .font-size-150ps { font-size: 150%; }    .font-size-large { font-size: large; }  style> 주로 px , em , % 를 사용해봤으나 small large 등은 처음들어보는것같다.   2. font-family 프로퍼티 폰트를 지정한다. 컴퓨터에 해당 폰트가 설치되어 있지 않으면 적용되지 않는다. font-family 폰트는 여러 개를 동시에 지정이 가능하다...

https://poiemaweb.com/css3-background CSS3 Background | PoiemaWebBackground 관련 프로퍼티는 해당 요소의 배경으로 이미지 또는 색상을 정의한다.poiemaweb.com    1. background-image 프로퍼티 요소에 배경 이미지를 지정한다. div {background-img : url("http:// ~~ .png"); }  2. background-repeat 프로퍼티 background-repeat : repeat //  반복 출력 , 기본값background-repeat : repeat-x  // x축으로만 배경 이미지를 반복할 경우background-repeat : repeat-y  // y축으로만 배경 이미지를 반복할 경우ba..

https://poiemaweb.com/css3-display CSS3 Display | PoiemaWebdisplay 프로퍼티는 layout 정의에 자주 사용되는 중요한 프로퍼티이다.poiemaweb.com    1. display 프로퍼티 block : block 특성을 가지는 요소(block 레벨 요소)로 지정 inline : inline 특성을 가지는 요소(inline 레벨 요소)로 지정 inline-block : inline-block 특성을 가지는 요소(inline-block 레벨 요소)로 지정 none : 해당 요소를 화면에 표시하지 않는다 (공간조차 사라진다) 1.1 block 레벨 요소.항상 새로운 라인에서 시작한다.화면 크기 전체의 가로폭을 차지한다. (width: 100%)width,..