Enjoy Programming

이번엔 more 페이지를 작성 해보자 역시 find.html의 코드를 모두 복사해서 붙여넣자 그리고 필요없는 코드를 지우자~ 메인 태그안에 모든 요소 삭제! 하고서 헤더에 뮤직 아이콘 추가~~~ 이제 메인 태그를 꾸며 보자~ 어디서 봤다~ friends페이지에 user-component부분이다. user-component부분을 복사해서 붙여넣기 하자~ 다른 점이 있다면 이름 아래 서브타이틀이 달려있고 두번째 칼럼에 메세지 아이콘이 있다 두번째 칼럼에 아이콘은 역시 쉽다 그냥 fontawesome에서 적당한거 하나 갖다 붙여넣기 끝! ㄱ리고 서브타이틀에 전화번호를 넣고 아이콘을 넣자~ 서브타이틀 마진탑과 폰트사이즈 조절해주고 투명도 조절~ 빨간 느낌표 아이콘은 옆으로 패딩값 조절해주고 컬러는 색상 조절 해..

자 이제 마지막 부분인 open-chat 박스를 만들어 준다 그 안에 크게 open-chat__header와 open-post박스를 생성 해줌. open-chat header안에는 타이틀과 오르쪽 텍스트를 넣어줄 태그 두개를 만들어 주고 chevron아이콘도 삽입 해주자~ 역시 flex해주고 space-between으로 간격을 조절 해준다. 나머지 폰트 크기나 투명도 마진등등을 조절 해줌 이어서 open-post부분을 작성 해주자. open-post부분은 크게 두개의 칼럼으로 구성 되어 있다. 칼럼 두개를 만들어주고 첫번째 칼럼에 h5, h6태그 두개에 타이틀과 해쉬태그 부분을 작성 해준다 그리고 멤버스 태그 한개를 만들고 그 안에 이미지 한개와 텍스트 들어갈 태그 두개와 그 사이 divider를 만들어..

이틀 쉬었으니 열심히 다시 달려보자~~~ 오늘은 노마드코더 강의로 내비게이션 바를 만들고 강의를 주욱 들어보겠다 보통 네브바는 ul로 구성되고 그 안에 많은 리스트들로 구성된다고 한다~ 반드시는 아니지만 보통 그렇다 하니 그렇게 연습해보자 developer.mozilla.org/ko/docs/Web/Guide/HTML/Using_HTML_sections_and_outlines HTML 구획과 개요 사용하기 - 웹 개발자 안내서 | MDN HTML 구획과 개요 사용하기 중요: 개요 알고리즘은 W3C의 최종 명세에 포함된 적이 없고, 브라우저와 보조 기술 중 알고리즘을 구현한 경우도 없습니다. 따라서 개요 알고리즘을 사용해 사용자에 developer.mozilla.org friends.html로 index...

not연산자가 나온다. 앞선 포스팅에서 의문점을 여기서 교육적으로 해결 해 주신다. awesome! developer.mozilla.org/ca/docs/Web/CSS/:not :not() - CSS | MDN :not() La pseudo-class CSS :not() representa elements que no coincideixen amb una llista de selectors. Atès que impedeix que es seleccionin elements específics, es coneix com a pseudo-class de negació. :not(p) { color: blue; } Notes: Els selectors inú developer.mozilla.org 간단하게 n..

시작하기에 앞서 기본적으로 브라우저가 알아서 html에 css를 적용시키게 되는 게 몇 개 있다. 이를 해결하기 위해 reset.css를 사용 간단하다 meyerweb.com/eric/tools/css/reset/ CSS Tools: Reset CSS CSS Tools: Reset CSS The goal of a reset stylesheet is to reduce browser inconsistencies in things like default line heights, margins and font sizes of headings, and so on. The general reasoning behind this was discussed in a May 2007 post, if you're inter ..