profile
Keep it up
post-thumbnail

[스터디 1차 과제] - 웹사이트 클론코딩

5월 2주차에 HTML 마크업과 CSS 스타일 적용하는 공부를 위해서 키친 인큐베이터 웹사이트를 클론코딩 하기로 하였다. <header> 부분에 로고, 메뉴, util-list 등을 배치할 것을 고려해서 구조를 만들어야 됐기 때문에 마크업 하는 것이 어려웠다. 메

2022년 6월 29일
·
0개의 댓글
post-thumbnail

TIL(2022.05.21)-[CSS] 미디어쿼리

미디어쿼리

2022년 6월 1일
·
0개의 댓글

TIL(2022.05.20)-[JS] 조건문 & 반복문

조건문 if...else if, else 에 중첩을 시킬 수도 있다. switch문 case가 한정적일 때 사용하면 if...else 구문보다 간결하게 사용이 가능하다. 값으로 평가할 수 있는 것들을 표현식이라고 한다. break문이 필요하다. break문을 사용하

2022년 5월 29일
·
0개의 댓글

TIL(2022.05.19)-[JS] 산술단항연산자 & 삼항 연산자

산술단항연산자 삼항연산자

2022년 5월 26일
·
0개의 댓글
post-thumbnail

TIL(2022.05.18)-[CSS]... 말줄임표 & flex로 글씨 가운데 정렬

white-space 요소가 공백 문자를 처리하는 속성이다. white-space: normal : 기본값, 자동으로 줄 바꿈이 된다. white-space: nowrap : 자동 줄바꿈 안됨 (엔터와 스페이스바 적용 안됨) white-space: pre : 자동 줄

2022년 5월 25일
·
0개의 댓글
post-thumbnail

TIL(2022.05.17)-[CSS] display: none과 visibility: hidden의 차이

공간을 차지하지 않고, 보이지 않게 하는 것이다.공간을 차지하고 있지만, 보이지 않게 처리하는 것이다.공간은 확보해야 되지만, 보이지 않아야 되는 경우에 사용한다.위 같은 경우에는 manage friends 톱니바퀴 아이콘에 display: flex, justify-c

2022년 5월 25일
·
0개의 댓글

TIL(2022. 05.16) -[CSS] Flex

flex flex를 사용하기 위해서는 일단 플렉스를 사용할 부분을 컨테이너로 묶어줘야 된다. 배치하려는 요소들은 아이템이라고 한다. 부모 컨테이너에 설정할 수 있는 속성 display: flex container에 display: flex; 값을 준다. float와

2022년 5월 25일
·
0개의 댓글

TIL(2022.05.14) - [CSS] 모바일 코딩 예제를 만들어보면서(선택자, position)

금요일날 예제를 만들어보았지만, 그 시간에 다 만들 수 없어 토요일날도 예제를 만들어봤다. 예제를 만들어보면서 구현이 되지 않았던 부분과 수정한 부분을 같이 기록해두려고 한다. 오답노트 position을 잘못 생각한 부분 이런식으로 BEST MENU 글씨 위에 선을

2022년 5월 23일
·
0개의 댓글
post-thumbnail

TIL(2022.05.13) - [CSS] vertical-align

블록 요소에 적용할 수 있는 속성이 아니다.inline 요소나 inline-block 요소, table-cell 요소에 적용할 수 있다.셀 안에서 수직 정렬하는 속성이다.인라인 요소 사이에 생기는 공간을 vertical-align을 이용해서 맞춰준다.이미지 요소는 in

2022년 5월 23일
·
0개의 댓글

TIL(2022.05.12) - 반응형 단위

반응형 단위 절대값 : px 상대값 : %, em, rem, vw, vh, vmin, vmax % 단위 : %를 이용할 때는 calc() 함수를 같이 이용한다. 0으로 나눈면 에러가 발생하고, 연산자는 기호를 기준으로 띄어쓰기를 꼭 해야 된다. em 단위

2022년 5월 23일
·
0개의 댓글

TIL(2022.05.11)- 메뉴 만들기

메뉴를 만들고, 메뉴에 hover 됐을 때의 스타일 적용까지 배워보았다.depth1에 depth2가 들은 구조(ul, li 구조를 중첩으로 만들려면 ul 밑에 자식으로는 꼭 li가 와야 되지만, li 하위 요소로는 어느 것이든 와도 상관 없다.) ::after를 이용해

2022년 5월 22일
·
0개의 댓글

TIL(2022. 05.10) - [HTML] form

form 태그는 자주 쓰이는 태그로 우리가 로그인할 때 보는 로그인창, 검색창을 이용할 때마다 보았을 것이다. form 태그에 대해서는 한 차례 정리해놓은 적이 있었다. (혼자 공부하면서 html 태그에 대해서 정리했을 때 정리했다) form `` : 주소 표시줄에

2022년 5월 15일
·
0개의 댓글

TIL(2022.05.09)-[CSS] box-sizing & 변형방법

블록태그 하위태그 이 부분이 헷갈려서 정리를 해둬야겠다. 블록 태그의 하위 태그로는 블록 태그, 인라인 태그가 가능하다. 인라인 태그의 하위 태그로는 인라인 태그는 가능하지만, 블록 태그는 가능하지 않다. !!! 예외가 있다. `` 앵커 태그는 인라인 태그지만 하위

2022년 5월 12일
·
0개의 댓글

TIL(2022.05.06)- clearfix class & pseudo

clearfix float에서 ul의 높이 값을 따로 주지 않았을 경우, li태그의 콘텐츠 값으로 지정이 된다. 근데 ul의 자식 태그들을 모두 float 할 경우에는 ul 태그의 height 값이 0이 된다. 그렇게 되면 형제 요소가 끌려 올라오는 현상이 발생하기 때

2022년 5월 9일
·
0개의 댓글
post-thumbnail

TIL(2022.05.04)-[HTML/CSS] table과 float

3일차에는 표를 만드는 table 태그, pseudo-class 중 nth-child와 nth-of-type에 대해서 배웠고, css 속성 중 float에 대해서 배웠다.옛날에는 구조를 잡을 때 table 태그를 사용했는데, 지금은 구조를 잡을 때 잘 사용하지는 않는다

2022년 5월 8일
·
0개의 댓글
post-thumbnail

TIL(2022.05.03)-[CSS] CSS에 대해서 배우고 적용해보기

2일차에는 블록레벨과 인라인레벨, CSS의 속성들에 대해서 배웠다. 이미 공부를 했었기 때문에 복습하는 부분도 있었고 새롭게 알게 된 부분도 있었다. 그래서 오늘 새롭게 알게 된 것에 대해서 정리를 해보고, 교육 과정 중에 다 끝내지 못한 예제 문제를 혼자 적용해본 것

2022년 5월 5일
·
0개의 댓글

TIL(2022.05.02)- HTML & CSS

오늘부터 sesac 청년취업사관학교(마포캠퍼스)에서 교육을 3개월동안 받게 되었다. 그래서 다시 시작하는 TIL(Today I Learned)!HTML이랑 CSS는 이미 배우고 복습한 부분이지만, 다시 시작하는 마음으로 기록하려고 한다.새싹 1일차 시작~HTML은 Hy

2022년 5월 2일
·
0개의 댓글

TIL(2022.2.10)- [JS] element를 가져오는 방법 및 Event

<h1> element를 가져오고 싶은 경우, getElementById 함수를 이용해서 id 선택자를 가져올 수 있다.class 선택자를 가져오고 싶은 경우, getElementByClassName 함수를 이용해서 class 선택자를 가져올 수 있다.위 두 가지

2022년 2월 10일
·
0개의 댓글

TIL (2022. 2.9) - [JS] 전역변수, 지역변수

전역변수는 애플리케이션 전역에서 접근 가능한 변수이다.지역변수를 선언할 수 있는 곳은 함수로 제한된다.같은 이름의 변수가 동시에 정의되어 있다면 지역변수가 전역변수보다 우선한다.생활코딩 강의를 통해 지역변수와 전역변수에 대해서 배워봤다. 그리고 전역변수와 지역변수에 대

2022년 2월 9일
·
0개의 댓글
post-thumbnail

TIL (2022.1.21) - [CSS] flex

flex flex 화면 크기에 따라 레이아웃의 배치나 크기를 조절해야 할 때 편리하게 배치할 수 잇고

2022년 1월 21일
·
0개의 댓글