![Read more about the article [03] flex-direction 가로 정렬, 세로 정렬](https://sp-ao.shortpixel.ai/client/to_auto,q_glossy,ret_img,w_435,h_340/https://nscworld.net/wp-content/uploads/2022/04/CSS.webp)
어떤 요소에 display: flex 를 적용하면 해당 요소는 flex container로 바뀌게 됩니다. 이렇게 되면 해당 요소의 자식 요소들을 가로나 세로로 정렬할 수 있게 됩니다. 즉 display:flex;를 선언한 부모 요소에 flex-direction 속성을 설정하게되면 가로나 세로로 정렬할 수 있습니다. flex-direction 속성 값들 flex-direction 디폴트 값은…
CSS 초승달 모양 만들기 를 통해서 background-color의 속성 transparent 이용 방법과 border-radius, box-shadow의 사용 방법을 알아보자. <style> .center { position: absolute; margin: auto; top: 0; right: 0; bottom: 0; left: 0; width: 100px; height: 100px; background-color: yellow; border-radius: 0px; box-shadow: 25px 10px 10px…
Unsplash API 사용법 : 해당 api를 이용해서 이미지를 가져오는 React app을 만들어 봅시다. 해당 API 를 사용하려면 먼저 Unsplash developers에 등록하여 access key를 소유하고 있어야 합니다. 그 방법은 다른 포스트에서 정리해 두었습니다. Unsplash API 액세스키 만드는 방법 - 도롱뇽 BLOGUnsplash API 액세스키 등록…
오늘은 세계적으로 알려진 무료 이미지 제공 사이트인 Unsplash API 액세스키 만드는 방법을 간단히 설명합니다. 결국 나중에 API를 이용해서 원하는 이미지를 가져와서(fetching) 웹페이지에 뿌려주는 방법까지 설명할 예정입니다. 하지만 오늘은 일단 unsplash API의 액세스키와 시크릿키를 만드는 방법까지만 설명합니다. Unsplash API 액세스키 가져오는 방법 Unsplash API…