whatisthis?

https://mywebproject.tistory.com/122 HTML 훈련 - (12) Gmail Inbox Gmail Inbox REFERENCE (style.css / app.js) https://github.com/rohjs/bugless-101/tree/master/html-practice/12-gmail-inbox 김버그의 HTML&CSS는 재밌다 - 구름EDU HTML&CSS를 한번에! 탄탄한 개념이해부터.. mywebproject.tistory.com var inboxCheckboxes = document.querySelectorAll(".inbox-checkbox") var inboxStars = document.querySelectorAll(".inbox-star") inboxChe..

https://mywebproject.tistory.com/122 HTML 훈련 - (12) Gmail Inbox Gmail Inbox REFERENCE (style.css / app.js) https://github.com/rohjs/bugless-101/tree/master/html-practice/12-gmail-inbox 김버그의 HTML&CSS는 재밌다 - 구름EDU HTML&CSS를 한번에! 탄탄한 개념이해부터.. mywebproject.tistory.com * { margin: 0; box-sizing: border-box; } html { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, C..

Gmail Inbox 우선, 마크업을 하기 전에 어떤 방식으로 마크업할지 생각해보자. 방법 1. 리스트 이용 (두 줄이 비슷한 구조이므로) 방법 2. 테이블 이용 (각 내용들이 분류가 똑같이 나누어지므로) 이때는, 리스트보다는 테이블을 이용하여 마크업해주는것이 바람직하다. 강의 내용은 생략. index.html Actions Sender Titles Timestamp Select this Email Add to Favorites Goorm Edu Unread: Rate your course: FRONTEND 101 WITH KIMBUG - Woohyeon. How’s everything going? We want to hear your opnion on.. 3:34 PM Select this Email ..

HTML href=" " 태그로 외부 CSS파일을 불러올때 사용 태그에 url을 입력할 때 사용 src=" " 로 외부 js파일을 불러올 때 사용 태그에 url을 입력할 때 사용 link인 경우 href link가 아닌 경우 (이미지,비디오 등) src CSS url( ) CSS 코드 또는 HTML의 에서 특정 파일을 불러올 때 사용 background-image: url("../images/google.png"); REFERENCE https://developer.mozilla.org/ko/docs/Web/HTML/Element/link : 외부 리소스 연결 요소 - HTML: Hypertext Markup Language | MDN HTML 요소는 현재 문서와 외부 리소스의 관계를 명시합니다. 는 스..

https://mywebproject.tistory.com/118 var followButton = document.querySelector(".feed-user-profile button") var likeButton = document.querySelector(".feed-footer button:first-child") var commentButton = document.querySelector(".feed-footer button:last-child") var feedComment = document.querySelector(".feed-comment") followButton.addEventListener("click", function() { if (this.following) { this.i..

https://mywebproject.tistory.com/118 HTML 훈련 - (11) Feed https://user-images.githubusercontent.com/19285811/69063907-43da4800-0a58-11ea-8efb-4b57dca4e3fe.png The most beautiful experience we can have is the mysterious. It is the fundamental emotion that s.. mywebproject.tistory.com * { margin: 0; box-sizing: border-box; } html { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,..

https://user-images.githubusercontent.com/19285811/69063907-43da4800-0a58-11ea-8efb-4b57dca4e3fe.png The most beautiful experience we can have is the mysterious. It is the fundamental emotion that stands at the cradle of true art and true science. — Albert Einstein Feed 우선, 최소한의 기능 단위로 나눠보자. 마크업을 하기 전에 꼭 해야 함! index.html Kimbug 30 min Follow The most beautiful experience we can have is the myste..

https://mywebproject.tistory.com/116 @import url("https://fonts.googleapis.com/css?family=Nunito+Sans:400,600&display=swap"); * { margin: 0; box-sizing: border-box; } html { font-family: "Nunito Sans", sans-serif; font-size: 16px; line-height: 1.5; color: #1f2d3d; } body { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; height: 100vh; margin: 0 a..

Input Group 연습하기! 마크업 부분 나누기. 1. h1과 paragraph Manage Subscriptions You can follow the discussion on @kimbug without to leave a comment. Cool, huh? Just enter your email address in the form here below and you are all set 2. input 태그와 button Subscribe button type = submit 을 이용하여 폼을 제출해야하므로, form 으로 반드시 감싸줘야한다. method는 GET 을 사용한다. https://mywebproject.tistory.com/73 etc) HTTP - GET 방식 vs POST 방식 G..

ECMA Script 기준. ❗ 객체의 구성 1. Built-in Object(자바스크립트 내장객체) Built-in Object 에는 Global, Object, String, Number, Boolean, Date, Array, Math, RegExp, Error 등 많은 내장객체들이 존재한다. 이들은 자바스크립트 엔진이 구동되는 시점에서 바로 제공되며 자바스크립트코드 어디에서든 사용이 가능하다. 2. Native Object(브라우져 내장 객체) Native Object 역시 자바스크립트가 구동되는 시점에서 바로 사용이 가능한 객체 들이다. 하지만 이들은 자바스크립트 엔진이 구성하는 기본객체라고 하기 보단 브라우져 즉 자바스크립트 엔진을 구동하는 녀석들에서 빌드되는 객체 들이다. 자바스크립트 프로그..