Study/Frontend

[HTML/CSS] overflow,transition

david95j2 2020. 12. 3. 09:23

Q.1 넘쳐나는 내용 무조건 숨김 ?
    overflow-x:hidden;

Q.2 넘친 텍스트 ... 으로 처리
    text-overflow:ellipsis;

Q.3 절대 줄바꿈 금지
    white-space:nowrap;

Q.4 필요에 따라 가로 스크롤바 생성
    overflow-x:auto;

Q.5 필요에 따라 가로 스크롤바 생성
    overflow-x:scroll;

 

Q.6 변환옵션을 준다.

    transition: width 1s, opacity 4s;

    * width 1s => 너비를 변환하는데 duration(기간)을 1초 동안 천천히 진행하겠습니다.
    * opacity => 투명도를 변환하는데 duration(기간)을 4초 동안 천천히 진행하겠습니다.

 

Q.7 투명도.

    opacity:0;

    * opacity => 투명도(0=완전투명,안보임/1=완전불투명,보임)

 

Q.8 스크롤바 내려도 계속 따라 움직이며, 창에 고정시키기.

    position:fixed;

 

 


데이터 구조

ㅋㅋㅋㅋㅋㅋ



tr,th,td,div,article,section...등등 많은 것들이 속안에
before,after 태그가 들어있는데 비활성화 되어있는 것일 뿐이다.

그래서!! ul>li::before { content:"나는 앞에 붙는다."; }이런식이다!!!

이때, 저 콘텐츠를 지워버리면 아예 다시 비활성화된다.

 

 

 

 

'Study > Frontend' 카테고리의 다른 글

HTML <meta> 태그  (0) 2020.12.02
HTML <!DOCTYPE> 선언  (0) 2020.12.01
[HTML5&CSS3] : 태그 속성  (0) 2020.11.27
[HTML&CSS] 태그  (0) 2020.11.25
[HTML] 태그 정리  (0) 2020.11.25