| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 | ||
| 6 | 7 | 8 | 9 | 10 | 11 | 12 |
| 13 | 14 | 15 | 16 | 17 | 18 | 19 |
| 20 | 21 | 22 | 23 | 24 | 25 | 26 |
| 27 | 28 | 29 | 30 | 31 |
- 전개연산자
- 알고리즘
- js
- 프로그래머스 코딩테스트
- 합계 알고리즘
- @mixin
- VSCODE단축키
- html 태그
- 문자열
- 자바스크립트
- TAG
- 프로그래머스
- Em
- vscode
- carousel slider
- HTML
- inline
- SASS
- scss
- javascript
- 인라인
- object
- string
- float
- layout
- 인라인블록
- input
- 코딩테스트
- ::before
- css
- Today
- Total
목록float (3)
Outputor
layout 2
반응형을 만들 때는 모바일 버전을 먼저 확인하고 만드는 것이 좋음 order로 순서 제어하면 편함 float으로 만들었음 (flex 사용하면 훨씬 편함) 더보기 더보기 코드 Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsa veritatis fugit, culpa quae incidunt laudantium quo dolor ratione Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsa veritatis fugit, culpa quae incidunt laudantium quo dolor ratione Lorem ipsum dolor sit amet consectetur adipis..
Landing 페이지2
background에 url로 이미지를 삽입해서 img와 text에 absolute를 넣지 않고 작성함 hover 이벤트시 이미지 사이즈는 작아지지 않게 작성함 더보기 더보기 코드 PORTFOLIO What you can Do name one Lorem, ipsum dolor sit amet consectetur adipisicing elit. Harum optio ratione possimus name two Lorem, ipsum dolor sit amet consectetur adipisicing elit. Harum optio ratione possimus name three Lorem, ipsum dolor sit amet consectetur adipisicing elit. Harum opti..
CSS position
float 속성 float: none ➡ float 속성을 적용안함 (기본값) float: left ➡ 요소가 컨테이너의 왼쪽에 배치됨 float: right ➡ 요소가 컨테이너의 오른쪽에 배치됨 margin: auto ➡ 요소를 중앙에 배치 clear 속성 float 속성이 적용되면 다음 요소가 float 속성을 상속 받는데 이걸 해제시킴 clear: left ➡ 왼쪽으로 배치된 float 속성 상속을 해지 clear: right ➡ 오른쪽으로 배치된 float 속성 상속을 해지 clear: both ➡ 양쪽에 배치된 float 속성 상속을 해치 (추천) float 속성을 쓴 태그의 부모 요소에 ::after로 clear:both 해주면 됨 이 부모 태그 안에는 float 속성이 들어간 태그만 사용하는..