🤗CSS 3

핵심 css!(3/3)

#.1)display 모든 div 는 block 요소이다 block을 써주지 않아도 적용이 된다. 본인이 속한 한 줄이 전부 자기만의 값을 가지고 있고 그다음의 요소가 올 경우 바로 밑에 쌓이게 된다. 여기서 display: inline; 속성을 사용하면 요소가 가지고 있는 값들의 범위만큼만 크기를 가지게 되고 한 줄로 나열하게 된다. 그리고 inline 속성들의 특징(?)이 있는데 밑의 사진을 보면 중간중간 띄어쓰기가 되어 있는 부분을 볼 수 있을 것이다. 이 이유는 위의 사진 중 html에서 div들을 가독성을 위해 한 줄에 1개씩 작성하였기 때문에 띄어쓰기가 적용된 것이다. 한 줄에 3개의 div를 모두 같이 쓰게 된다면 결과 창에서 띄어쓰기가 사라지는 대신에 코드의 가독성이 떨어질 것이다. #.2..

🤗CSS 2023.01.01

핵심 css!(2/3)

#1 핵심 CSS 복습하기! position에 대하여 알아보자! 아무것도 선언해주지 않는다면 기본값은 relative이다. position:abdolute는 지금과 같은 경우 기준점이 div로 바로 위의 조상을 기준으로 움직인다. body를 길게 늘린경우 (웹사이트) 우측에 스크롤바가 생긴다. position: fixde를 이용하면 스크롤을 아무리 내리더라도 설정한 값의 위치에 따라 고정할 수 있다. 예를 들면 쇼핑몰의 카톡상담 아이콘이 있다. position: fixde 사용시 주의할 점은 위의 내용과 같이 P 태그와 겹쳐서 보여질 수 있다는 것을 염두해 두고 사용 하여야 한다. position: sticky 는 주로 모바일에서 많이 사용한다. 스크롤을 따라 올라가지다가 요소가 딱 걸쳐질 경우 고정된다..

🤗CSS 2022.12.25

12월 12일~ 18일 학습내용

#1 핵심 CSS 복습하기! 저번주에는 핵심 HTML에 대하여 복습을 하는 시간을 가져 보았고 이번주는 CSS에 대하여 조금씩 정리를 해보려고 한다. #2 CSS란? 종속형 시트 또는 캐스케이딩 스타일 시트(영어: Cascading Style Sheet)는 마크업 언어가 실제 표시되는 방법을 기술하는 스타일 언어(영어: Style sheet language 스타일 시트 랭귀지[*])로[1], HTML과 XHTML에 주로 쓰이며, XML에서도 사용할 수 있다. W3C의 표준이고, 레이아웃과 스타일을 정의할 때의 자유도가 높다. 자유도 - 위키백과, 우리 모두의 백과사전 위키백과, 우리 모두의 백과사전. ko.wikipedia.org CSS MDN 에서는 Cascading Style Sheets(CSS)는 ..

🤗CSS 2022.12.18