전체 글25 [개발공부] HTML/CSS 독학하기 (4) Box model / Intro 대부분의 element 들은 "block level" element 라고 한다. 그리고 다음과 같은 네가지 특성을 따른다. width of 100% of their parent height of 0 height grows to match the content stack one on top of the other 저번 블로그 마지막에 잠깐 본 친구들이 이 box level element 인 것 같다. 아직 이 친구들에 대한 디테일한 설명은 듣지 못했고 곧 바로 CSS 를 통해 위의 특성들을 확인한다. 다른 element selector 와 마찬가지로 tag 를 쓰고 { } 안에 스타일을 써주면 해당 태그에 스타일을 입힐 수 있다. e.g., header { backgroun.. 2023. 7. 9. [개발공부] HTML/CSS 독학하기 (3) Classes and IDs 저번에 마지막으로 잠깐 이야기를 하고 끝났었는데 오늘 배운 내용은 class와 id에 대한 내용이다. 각각의 태그 종류에 따라 스타일을 입히는 것을 넘어 자유롭게 스타일을 입힐 수 있게 해준다. 저번 시간에 Selector에 대해서 배웠다. CSS 를 적을 떄 해당 스타일이 어떤 태그에 관한 것인지를 나타내주는 것이 selector라고 했는데, 어떤 '태그'에 관한 selector는 'Element' selector라고 부른다. 따라서 엄밀히 말하면 저번 블로그에서 설명을 잘못 적었다고 할 수 있겠다. Selector 자체가 tag의 종류와 관계가 있는 것이 아니고 selector는 어떠한 값이든 그 스타일과 연결될 값이라고 보면 된다. 그리고 오늘의 주제인 Class sel.. 2023. 7. 8. [개발공부] HTML/CSS 독학하기 (2) Internal CSS 이전 글에서는 in-line CSS에 대해서 적었다. HTML tag에 하나의 attribute로써 작용하도록 한 것이었는데, 실제 많이 사용되는 방법은 아니라고 한다. 여러 가지 이유가 있는데, 예를 들어 100개의 가 있고 그 style을 일관적으로 바꾸고 싶을 때, in-line CSS를 사용하면 100개의 style을 바꿔야 한다. scalable 하지 않은 방법이라 잘 사용하지 않는다는 것. 그 대신에 지금 적을 Internal CSS를 사용한다고 한다. Internal CSS는 CSS를 HTML의 에 넣는다. tag의 종류를 적고 그 종류에 따라 일관적으로 style을 부여해줄 수 있다. 그렇기에 하나의 태그에 대한 스타일을 바꿔줄 때 간단하게 바꿔줄 수 있다는 장점이 .. 2023. 7. 7. [개발공부] HTML/CSS 독학하기 (1) 개념 우선 HTML 과 CSS가 무엇인지 정리해보자. HTML이란 Hyper Text Markup Language의 약자로 webpage에서 내용에 해당하는 부분을 담당한다고 보면 된다. 웹 사이트에서 텍스트, 제목, 문단 등에 해당하는 부분을 HTML로 작성할 수 있다. CSS란 Cascading Style Sheets의 약자로 HTML로 작성한 내용의 스타일을 꾸며줄 수 있는 언어이다. 폰트의 크기, 색깔, 배경 색깔 등 심심한 text에 조미료를 첨가할 수 있게 해주는 언어이다. HTML 구조 + 들어가기에 앞서 간단한 용어를 정리하자면, 과 같은 것들이 많이 보일텐데 이를 tag라고 하고 보통은 opening tag(i.e., )와 closing tag(i.e., )가 pair로 나온다. 그렇지 .. 2023. 7. 6. 이전 1 ··· 3 4 5 6 7 다음
