목록공부/html_css (6)

뚠뚜 개발일지

[CSS] css초기화/ 리셋 reset

https://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 meyerweb.com /* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 Lic..
공부/html_css 2023. 1. 4. 21:17
[HTML_CSS] Netflix clone coding

시작하며 - 프로젝트 기간 : 2022. 12. 14 - 학습 목표 : html과 cssa 그리고 맛보기 js로 넷플릭스 클론 코딩하기 (반응형) - 사용한 언어 : - 강의 영상 : https://www.youtube.com/watch?v=P7t13SGytRk&t=22s - 깃허브 페이지 : https://junmi0918.github.io/netflix-clone/ Netflix - Watch TV Show Online, Watch Movies Online Watch TV shows and movies anytime, anywhere - personalized for you. Watch Free For 30 Days Watch on your TV Smart TVs, PlayStation, Xbox, ..
공부/html_css 2022. 12. 16. 20:39
[HTML_CSS] 반응형 웹페이지 제작하기

시작하며 - 프로젝트 기간 : 2022. 12. 08 - 학습 목표 : html과 scss, 그리고 맛보기 js로 반응형 웹페이지 제작하기 - 사용한 언어 : - 강의 영상 : https://www.youtube.com/watch?v=D-h8L5hgW-wd - 깃허브 페이지 : https://junmi0918.github.io/beginning/html-css-beginning/ The 2022 Frontend Developer Crash Course junmi0918.github.io 준비과정 vs code 확장플러그인 "Live Sass Compiler"를 설치해준다. 폴더 안에 [name.scss] 파일을 만든 후 하단에 [Watch Sass] 버튼이 생성되면 [Watch Sass] 버튼을 눌러준다..
공부/html_css 2022. 12. 15. 12:35
[CSS] css flexbox 속성

align-items -컨테이너 안에서 어떻게 모든 요소들을 정렬하는지 지정한다. flex-start : 요소들을 컨테이너의 꼭대기로 정렬한다. flex-end : 요소들을 컨테이너의 바닥으로 정렬한다. center : 요소들을 컨테이너의 세로선 상의 가운데로 정렬한다. baseline : 요소들을 컨테이너의 시작 위치에 정렬한다. stretch : 요소들을 컨테이너에 맞도록 늘린다. align-self -개별 요소(특정 요소)에 적용할 수 있는 속성으로 align-items가 사용하는 값들을 인자로 받으며, 그 값들은 지정한 요소에만 적용된다. justify-content flex-start : 요소들을 컨테이너의 왼쪽으로 정렬한다. flex-end : 요소들을 컨테이너의 오른쪽으로 정렬한다. cent..
공부/html_css 2022. 11. 10. 23:11
[CSS] css로 춘식이 만들기

시작하며 라이언에 이어서 춘식이를 만들어보기로 했다. 라이언은 코드가 있었지만, 춘식이는 인터넷에 뿌려진 코드가 없었기 때문에 처음부터 끝까지 내가 직접 코드를 쳐서 구현했다. 1. 색상 뽑기 : 1차로 제작한 라이언 때와는 다르게 내가 처음부터 직접 제작을 해야했기 때문에 대상 분석을 꼼꼼히 진행했다. 하지만 위치는 라이언과 대략 비슷하다고 판단하여 빠른 제작을 위해 이 부분은 스킵했다. https://imagecolorpicker.com/ 👍 Color Picker online | HEX Color Picker | HTML Color Picker Color Picker:Color Picker: With this online tool you can upload an image or provide a w..
공부/html_css 2022. 11. 9. 16:11
[CSS] css로 라이언 만들기

시작하며 회사를 다니며 공부를 병행하다보니 코드를 직접 작성해보며 개발하는 것보다는 이론공부를 주로 하게 되었고 그 부분이 현재의 나에게 큰 문제점으로 다가왔다. html과 css는 기본으로 알고 있었지만, 그 코드가 손에 익지 않았으니 완벽하게 알고 있다고 할 수는 없었다. 그래서 css부터 다시 시작하려고 한다. 코드를 안 보고 칠 줄 알아야 내꺼다 https://zinee-world.tistory.com/426 [초급 튜토리얼] CSS로 라이언 그리기(3) - CSS 주요 CSS 설명 가장 많이 사용되는 CSS들 입니다. 링크를 누르면 예제와 간략한 설명을 보실 수 있습니다. box-sizing: border-box position: relative | absolute margin: 0 auto (..
공부/html_css 2022. 11. 9. 14:56
이전 Prev 1 Next 다음