728x90 CSS8 HTML - 티스토리 다크모드 토글 버튼 HTML 🌙 CSS /* 다크모드 */ .dark body{ background-color: #161618 !important; color: rgb(255, 255, 255) !important; font-weight: 700 !important; } 2023. 9. 30. CSS - 인기 있는 디자인 프레임워크(Tailwind CSS) https://tailwindcss.com/ Tailwind CSS - Rapidly build modern websites without ever leaving your HTML. Tailwind CSS is a utility-first CSS framework for rapidly building modern websites without ever leaving your HTML. tailwindcss.com https://flowbite.com/ https://flowbite.com/ flowbite.com 2023. 8. 28. CSS - 미디어쿼리 확인 사이트(mediaqueriestest.com) https://mediaqueriestest.com/CSS3 Media Queries Test on your browserCSS3 Media Queries is the heart of Responsive Design. This website will test all the features on your own browser, including screen dimensions, resolution and available extensions.mediaqueriestest.com 2023. 8. 28. CSS - :before를 이용한 채팅창 말풍선 꼬리 만들기 .parent { height: 20px; width: 100px; background-color: #080; position: relative; } .child { position: absolute; width: 80px; height: 200px; background-color: #008; left: 50%; /* note 50% */ top: 30px; margin-left: -20px; /* 2x your arrow size */ } .child:before { position: absolute; border-right: 10px solid transparent; border-bottom: 10px solid #008; border-left: 10px solid transparent; top: -.. 2023. 2. 5. CSS - 인라인 코드 블럭 대충 이런것입니다. /* 인라인 코드 블럭 */ code { padding: 0.25rem; background-color: #F1F1F1; border-radius: 5px; box-shadow: 0.25px 0.25px 10px rgb(156, 156, 156); font-family: "Consolas", "Sans Mono", "Courier", "monospace"; font-size: 1.0rem; } 참고: https://wordbe.tistory.com/entry/%EC%9D%B8%EB%9D%BC%EC%9D%B8-%EC%BD%94%EB%93%9C%EB%B8%94%EB%9F%AD-%EC%BD%94%EB%93%9C-%EA%B0%95%EC%A1%B0-%EC%BD%94%EB%93%9C-%EB%B0.. 2022. 7. 30. CSS - 슬라이더 API https://flickity.metafizzy.co/ Flickity · Touch, responsive, flickable carousels Easy to use. Fun to flick. Flickity makes carousels, galleries, & sliders that feel lively and effortless. flickity.metafizzy.co See the Pen Flickity - wrapAround by Dave DeSandro (@desandro) on CodePen. 2021. 12. 25. CSS - 미디어 쿼리 /* width under 576px */ @media (max-width: 575px){ body{ background-color: white; } } /* Mobile */ @media (min-width: 576px) and (max-width: 767px){ body{ background-color: red; } } /* Tablet */ @media (min-width: 768px) and (max-width: 991px){ body{ background-color: green; } } /* Desktop */ @media (min-width: 992px) and (max-width: 1199px){ body{ background-color: blue; } } /* width over 1200p.. 2021. 11. 29. CSS - 웹 디자이너가 추천하는 웹 디자인 도구 사이트 색깔 조합해주는 사이트 https://mycolor.space/ ColorSpace - Color Palettes Generator and Color Gradient Tool Just Enter a Color! And Generate nice Color Palettes mycolor.space 그레디언트 생성 도구 https://cssgradient.io/ CSS Gradient — Generator, Maker, and Background As a free css gradient generator tool, this website lets you create a colorful gradient background for your website, blog, or social media profile. c.. 2021. 11. 18. 이전 1 다음 728x90
HackLog
