일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- OSX
- 앱리소스
- 안드로이드
- otpkey
- SwiftUI
- apple
- SWIFT
- MSYS2
- openssl
- MYSQL
- 앱스토어
- git
- albumbook
- OTP
- SSL
- Android
- Nodejs
- FIDO2
- css
- MFA
- 인증
- appres
- 앨범북
- 애플
- SSH
- WebAuthn
- Xcode
- kmip
- fido
- 2FA
- Today
- Total
목록css (5)
인디노트
https://studiomeal.com/archives/197 이번에야말로 CSS Flex를 익혀보자 이 튜토리얼은 “차세대 CSS 레이아웃” 시리즈의 첫번째 포스트입니다. 이번에야말로 CSS Flex를 익혀보자 이번에야말로 CSS Grid를 익혀보자 벌써부터 스크롤의 압박이 느껴지고,‘좀 편안하게 누 studiomeal.com
/* ##Device = Desktops ##Screen = 1281px to higher resolution desktops */ @media (min-width: 1281px) { } /* ##Device = Laptops, Desktops ##Screen = B/w 1025px to 1280px */ @media (min-width: 1025px) and (max-width: 1280px) { } /* ##Device = Tablets, Ipads (portrait), ##Screen = B/w 768px to 1024px */ @media (min-width: 768px) and (max-width: 1024px) { } /* ##Device = Tablets, Ipads (landscape) #..
tr:nth-child(odd) 또는 tr:nth-child(2n+1) HTML 표의 홀수번째 행을 나타냅니다. tr:nth-child(even) 또는 tr:nth-child(2n) HTML 표의 짝수번째 행을 나타냅니다. :nth-child(7) 임의의 7번째 요소를 나타냅니다. :nth-child(5n) 5 [=5×1], 10 [=5×2], 15 [=5×3], ... 번째의 요소를 나타냅니다. 패턴 공식을 만족하는 첫 번째 값은 0 [=5x0]으로서 아무 요소도 선택하지 않는데, 요소의 인덱스는 1부터 시작하지만 n은 0부터 증가하기 때문입니다. 다소 의아할 수 있으나, 바로 아래 예제처럼 공식의 B 부분이 >0인 경우 보다 납득하기 쉬워집니다. :nth-child(n+7) 7번째와 그 이후의 모든 ..
웹을 디자인(개발?) 하다 보면 레이아웃을 잡기 위해서 외곽 (border) 를 임시로 설정하는 경우가 많습니다. 하지만 외곽을 주면 그 보더의 두께에 따라서 영역이 커집니다. 예를 들어 100% 짜리 폭의 div 에 border 를 1px 주면 (브라우저에 따라서 다르지만) 원하지 않던 스크롤바가 생기게 되죠. 그래서 전체 레이아웃에 오차가 발생될 수 있고 약간의 짜증이 나기도 합니다. 이럴때는 안쪽 테두리를 주는게 레이아웃에 더 합리적입니다. 예를 들어서 다음과 같이 모든 div 에 보더를 주는데 영역을 안쪽으로 주는 방법입니다. div { border: #f00 3px solid; box-sizing: border-box; } 다음은 영역 안쪽의 그림자를 주는 방식입니다. 예를 들어서 다음과 같이 ..