TIL no.1_html/css

chaerin·2020년 12월 8일
0

HTML/CSS

목록 보기
1/10

나의 첫 Today I Learned 기록이다.
매일 새롭게 알아가는 내용들에 대한 기록이자 나의 하루를 돌아보는 일기와도 같은 것이다.
한 귀로 듣고 한 귀로 흘리듯 많은 정보들을 흘려 보내왔던 지난날들을 반성하며 이제는 그냥 흘려 보내지 않으리라!! 하는 마음으로 시작해보려 한다.

위코드 사전스터디 1주차로서 html과 css를 이용한 자기소개서 페이지 만들기 진행중이다.

1. 'h'태그 줄바꿈 없애기

'h'태그는 'h1', 'h2', 'h3', 'h4', 'h5', 'h6'까지 총 6단계로 이뤄진 문서의 제목을 나타내는 'heading' 태그이다. 'h'태그를 자동 줄바꿈 기능이 있어서 이 태그를 사용했을 시 같은 줄에 나타내기 위해서는 css를 이용하여 블럭 레벨을 인라인으로 바꿔줘야 한다.

> ```
h1, h2 {
    display: inline;
}

2. CSS - transform

transform : 요소에 회전, 크기 조절, 기울이기, 이동 효과를 부여할 수 있다.

2D 변형(transform)을 위해 제공되는 메소드(method)는 다음과 같다.

  1. translate() : 요소를 x축과 y축의 거리만큼 이동
  2. rotate() : 주어진 각도만큼 시계방향 또는 반시계방향으로 회전
  3. scale() : 주어진 배율만큼 늘이거나 줄임
  4. skew() : 주어진 각도만큼 각각 x축과 y축 방향으로 기울임
  5. matrix() : 모든 2D transform 메소드를 한 줄에 설정
matrix(scaleX(), skewY(), skewX(), scaleY(), translateX(), translateY());

참고 사이트 : http://www.tcpschool.com/css/css3_transform_2Dtransform

0개의 댓글