본문 바로가기

frontend8

[개발공부] 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.
[개발공부] HTML/CSS 독학하기 (0) 개요 Daniel과의 프로젝트 tool box를 진행하기 위해 추천 받은 강의 사이트 scrimba에서 frontend 를 배우기 시작했다. 대학 시절 항상 backend만 했었고 마지막 프로젝트 과목에서 수박 겉핥기식으로 HTML과 CSS를 만져봤기에 완전 갓난 애기 느낌으로 기본부터 시작했다. 학기 마지막에 OS 수업을 들을지 Frontend 수업을 들을지 고민하다가, 재밌어 보이는 frontend를 포기하고 어려워 보이지만 더 중요할 것 같은 OS 수업을 선택했다. 덕분에 개발할 때 중요한 개념들을 배울 수 있었고 내 선택에 후회는 없다. 또 이렇게 얼마 지나지 않아 frontend를 배워볼 수 있어서 감사하다. 앞으로 공부한 것들을 기록 해보려 하는데 아주 기본적인 개념을 간단히 정리해보려고 한다.. 2023. 7. 5.