태그
Analytics Stats
  • All
  • Book
  • Diary
  • Programing
  • Web Skill

함수에의하여 이런식으로 클래스명에 무작위 숫자가 추가되는상태로 계속 생성되는 코드가있을때 blank라는 키워드가 포함된 클래스명에다가 스타일을 주는 방법입니다 *[id^='blank'] // id중에 blank라는 키워드로시작하는 것들을 선택함 *[id*='blank'] // id안에 blank 키워드를 포함하는 것들을 선택함 *[class^='blank'] // class중에 blank라는 키워드로시작하는 것들을 선택함 *[class*='blank'] ...

px, em, rem을 넘어서서 요새 많이 쓰이는 단위를 정리해보겠습니다. 사용함에 있어서 굉장히 편히라고 게다가 IE9부터 지원을 하기 때문에 앞으로의 쓰임이 더욱 기대되는 단위라고 합니다! 1. vw, vh ex) width:100vw; height:100vh; width에는 vw를 hright에는 vh를 사용합니다. 이 부분은 반응형웹과 같은 곳에서 쓰일수록 더욱 편리함이 높아집니다. 이 단위는 요소의 뷰포트값의 100분의 1을 하는...

transform 은 변형시키다라는 의미를 가지고 있는데 CSS의 transform 속성을 이용하여 이동(translate), 크기변화(scale), 회면(rotate), 기울기(skew)등의 효과를 줄 수 있다. 1. 이동 transform:translate(x,y) css.css .ex{ background-color: #000000; transform:translate(50px,50px); } 위 값으로 속성값을 주면 x축y축으로 50px 만큼씩 이동한다. 2. 크기조절 (확대/축소) > transform:scale(x,y) css.css .ex2{ background-color: red; transform:scale(1,0.5); } 위 값으로 속성값을 주면 x축은 100%, y축은 50%로 축소 3. 회전 > transform:rotate(각도) css.css .ex3{ background-color: blue; transform:loate(-45deg); } 위 값으로...