FrontEnd/css

1.displayLayout 정의에 사용되는 프로퍼티1-1.block새로운라인에서 시작하고 width가 100%다.width, height, margin-top, margin-bottom지정가능div,h1~h6,p,ol,ul,li,hr,table,form은 기본적으로 bolck 을 가진다.asdasasdasasdasasdas" data-ke-type="html">HTML 삽입미리보기할 수 없는 소스   1-2.inline문장의 중간에 들어갈수있음(줄을 안바꿈)content의 너비만큼 가로폭 차지width, height, margin-top, margin-bottom지정불가능span,a,strong,img,br,input,select,textarea,button은 기본적으로 inline안녕하세요안녕하세요"..

1.박스모델HTML의 모든 요소는 box 형태의 영역이다.  안녕      2.width , height너비와 높이를 지정해당 너비와 높이로 지정한 콘텐츠 영역보다 콘텐츠가 크면 넘치게 된다. 안녕하세요       3.margin, paddingmargin 하고 padding 영역을 정한다.  안녕      4.border4-1.border-style테두리선 스타일을 지정한다.다양한 종류가 있다.https://developer.mozilla.org/ko/docs/Web/CSS/border-style   4-2.border-width테두리의 두께를 정한다. 4방향에 정할수도있다.(border style 필수 적용)  4-3.bord..

1.크기 단위1-1.px픽셀 단위(화소)이다. 대부분의 브라우저는 1px을 1/96 인치로 잡는다." data-ke-type="html">HTML 삽입미리보기할 수 없는 소스  1-2.%요소에 지정된 사이즈에 상대적인 사이즈   1-3. em요소에 지정된 사이즈에 대한 상대적인 사이즈1em = 100% 2em= 200% " data-ke-type="html">HTML 삽입미리보기할 수 없는 소스  1-4.remhtml의 사이즈를 기준으로한 em " data-ke-type="html">HTML 삽입미리보기할 수 없는 소스    1-5.Viewport 단위viewport를 기준으로 한 상대적 사이즈vw는 뷰포트 너비의 1/100vh는 뷰포트 높이의 1/100vmin은 뷰포트의 너비와 높이 중 더 작은 쪽의 ..

가상 클래스 셀렉터요소의 특정 상태에 따라 스타일을 정의할때 사용  1-1. 링크 셀렉터link방문하지 않은 링크일 때visited방문한 링크일 때hover마우스가 올라와 있을 때active클릭된 상태일 때focus포커스가 들어와 있을 때  링크   1-2.UI 요소 상태 셀렉터:checked체크 상태:enabled사용 가능한 상태:disabled사용 불가능한 상태  1번 2번 3번 1번 2번 3번 " data-ke-type="html">HTML 삽입미리보기할 수 없는 소스     1-3 구조 가상 클래스 셀렉터:first-child모든 요소 중 첫번째 자식인 요소를 선택:last-child모든 요소 중 마지막 자식인 요소를 선택:nth-child(n)모든 요소..

1.전체 셀렉터모든 요소를 선택sdasasda   2.태그 셀렉터태그명으로 요소를 선택p { color: red; }a {color: antiquewhite;}   3. ID 셀렉터id 어트리뷰트 값을 지정하여 요소를 찾는다.sdasasdasdasasda" data-ke-type="html">HTML 삽입미리보기할 수 없는 소스   4.클래스 셀렉터class 어트리뷰트 값을 지정하여 일치하는요소를 찾는다.이미 정의되어있는 클래스를 지정하는것또한 가능하다.sdasasdasdasasda" data-ke-type="html">HTML 삽입미리보기할 수 없는 소스     5.어트리뷰트 셀렉터셀렉터[어트리뷰트]형태로 작성하여 지정된 어트리뷰트를 갖는 모든 요소를 선택qqqqqq    5-1.어트리뷰트 셀렉터 활용..

1.셀렉터스타일을 적용하고자 하는 HTML 요소를 선택하기위한 수단셀렉터{속성1:속성값}  2.속성(프로퍼티), 속성값셀렉터로 선택이후 {} 내에서 속성(프로퍼티)와 값을 지정한다.값은 키워드, 크기단위, 색상 표현단위등 특정 단위로 지정한다.   3.CSS HTML 연동법3-1.Link styleHTML에서 외부에 있는 CSS 파일을 로드하는 방식(외부 CSS 파일에 CSS가 작성되어있다.)    3-2.Embedding styleHTML 내부에 CSS를 포함하는 방법    3-3.Inline styleHTML요소의 style 프로퍼티에 CSS를 기술행복