하루하루 발전하는 개발자와 블로그🙌🏻 하루하루 발전하는 개발자와 블로그🙌🏻

Study

• button 누를 때 귀엽게 움직여보기

  Study/css 2020. 5. 17. 10:33

  button:active { transform: scale(0.98); }

  Read More
• button태그 버튼모양 없애는 방법

  Study/css 2020. 5. 17. 10:08

  버튼 태그를 작성하면 이렇게 버튼 모양이 자동적으로 생성된다. 흠.. 디자인이 좀 마음에 안드는데? 버튼 디자인 모양을 없애고 싶다면 아래와 같이 코드를 작성하면 된다. button{ all: unset; } 그럼 이렇게 버튼 모양이 완전히 사라짐. 여기서 내가 원하는 css를 줍시다~~

  Read More
• box-shadow 모음집

  Study/css 2020. 5. 16. 22:48

  box-shadow: 0 4px 6px rgba(50, 50, 93, 0.11), 0 1px 3px rgba(0, 0, 0, 0.08); 예쁜 박스 섀도우들.. 하나씩 모아보렵니당 💘

  Read More
• hover했을때 다른 요소에 변화주기

  Study/css 2020. 5. 16. 20:51

  큐브가 컨테이너 내부에 직접있는 경우 :#container:hover > #cube { background-color: yellow; } 큐브가 옆에 있으면 (컨테이너가 태그를 닫은 후) 컨테이너가 : #container:hover + #cube { background-color: yellow; } 큐브가 컨테이너 내부에 있으면 #container:hover #cube { background-color: yellow; } 큐브가 컨테이너의 형제 인 경우 : #container:hover ~ #cube { background-color: yellow; } 출처: https://www.it-swarm.dev/ko/html/div%EB%A5%BC-%EC%98%AC%EB%A0%B8%EC%9D%84-%EB%95%..

  Read More
• 이미지 파일이 커서 뚝뚝 끊겨서 출력되는 걸 막기위한 트릭

  Study/JavaScript 2020. 5. 16. 19:39

  img.addEventListener("loadend", 함수명); 이벤트 리스너를 사용하여 이미지가 다 로드 된 뒤에 이미지가 출력되도록 트릭을 사용해본다.ㅎㅎ

  Read More
• API

  Study/JavaScript 2020. 5. 16. 16:22

  API (Application Programming Interface)는 다른 서버로부터 손쉽게 데이터를 가져 올 수 있는 수단이다. 오직 데이터만 가져오는 것이다. 이런 웹사이트를 이용하면(weather API)(API를 제공하는) 해당 웹사이트를 통해 데이터를 얻을 수가 있는데, 우리가 가져올 것은 데이터뿐이다. 디자인이나 다른것은 필요하지 않다. 그러니까 이런 API는 특정 웹사이트로부터 데이터를 얻거나 컴퓨터(Machines)끼리 소통하기 위해 고안된 것이다. 그게 우리가 api에 아무 디자인이 필요없는 이유이다. 그리고 이 API(weather map)를 공개한 사람들 있잖아? 이 사람들은 이 api를 공짜로 사용하라고 제안하고 있다. 예컨데 여기 나온 url 예제로 request를 보내면, 데..

  Read More
• Storage.setItem()

  Study/JavaScript 2020. 5. 16. 11:57

  The setItem() method of the Storage interface, when passed a key name and value, will add that key to the given Storage object, or update that key's value if it already exists. Syntax storage.setItem(keyName, keyValue); Parameters keyNameA DOMString containing the name of the key you want to create/update.keyValueA DOMString containing the value you want to give the key you are creating/updating..

  Read More
• The onFulfilled and onRejected Functions

  Study/JavaScript 2020. 5. 15. 19:01

  The onFulfilled and onRejected Functions To handle a “successful” promise, or a promise that resolved, we invoke .then() on the promise, passing in a success handler callback function: const prom = new Promise((resolve, reject) => { resolve('Yay!'); }); const handleSuccess = (resolvedValue) => { console.log(resolvedValue); }; prom.then(handleSuccess); // Prints: 'Yay!' Let’s break down what’s ha..

  Read More