실수

6mn12j·2020년 8월 9일
0

background 하면서 정리,실수
1. 왜 img 태그가 아닌 background 를 쓰는지
에어비앤비카드의 이미지 같은 경우에는 사용자가 자신의 집 사진을 찍어서 올린다 -> 이렇게 되면 가로로 긴 사진 ,세로로 긴 사진이 나올 수 있음 그런데 img 태그를 사용하게 되면 클래스도 추가하고 어쩌구 저쩌구 하거나 서버에서 이미지를 처리하거나 JS 로 처리해야하는데 background-image로 전체 크기 정해놓고 size 를 cover 로 해주면 처리가 가능

내가 css 쓰면서 틀린거

1.line-height 기본적으로 em 이라서 나누기 해주고 넣어줘야하는데 계속 px 씀
2.justify-content:space-around 요놈 잘 쓰기 계속 start 로 해놓고 margin 으로 어떻게 해보려고함 .
3.리뷰의 별 이미지 html 로 태그 추가함 별 이미지는 큰 의미가 없어서 스타일 요소로 처리 해야함 -> 이거할때 가상요소 ? 그거 만든거 .property-rate::before 하면 property-rate 태그의 첫번째 자식 요소가 추상적으로 만들어지는거
4.html 태그 만들때 content ,header 요렇게 부분별로 나눠 놓으니까 flex로 바로 정렬이 되서 편함 나도 이렇게 해야겠다 .근데 이 생각 저번에도 한거 같은데 이번에 또함 주의 해야하겠음
5. html 태그에는 Plus 였는데 사용자 웹 화면엔 PLUS 라는 버튼으로 적혀있어서 내마음대로 PLUS로 html 태그에서 바로 고친거 요것도 스타일 적인 면이라서 text-transform:uppercase 이용하면 대문자로 바뀌는거]
6.sr-only ,(screenreader)마크업을 위해서 클래스 만들어야함, dl 무언가 용어를 정의 할때 dt,dd가 꼭 있어야함 정이하고나 하는 용어 term 과 설명이 있어야함.

.sr-only{
      position: absolute;
      z-index:-100;
      width:1px;
      height: 1px;
      overflow: hidden;
      opacity: 0;
  }

7.가상요소는 기본적으로 inline 요소 linline 요소는 margin top,bomttom 은 못주지만 right , left 는 줄 수 있음
8.선택자 중 :last-child
9.flex-grow 남는 영역만큼 채울건지 안채운다 0 채운다 0아닌 정수값

profile
TIL 쩨끼럽 남기는 중 💻

0개의 댓글