webplacidcy

소리 파일(음악 등)을 사용할때 쓰이는 태그로 MP3 / WAV/ ogg 파일을 지원한다

표를 표현하는 태그 1. table : 테이블 영역을 나타내는 태그 2. caption : 테이블의 제목이나 설명을 작성하는 태그 3. tr : 테이블의 행을 의미하는 태그 4. th : 테이블의 제목 셀을 의미한다 / 부모 태그인 tr 안에 있어야 한다 5. td : 테이블의 일반 셀을 의미하며 테이블의 내용이 들어간다 / 부모 태그인 tr 안에 있어야 한다 6. border : 테이블 셀 주위의 선에 대한 처리 7. width : 테이블의 가로 너비를 설정한다 8. cellpadding: 셀과 셀 안의 컨텐츠와의 간격을 조절한다 9. cellspacing : 셀과 셀 사이의 간격을 설정한다 - 셀(열) 병합 속성 1. colspan : 같은 행의 열에 대한 칸을 병합한다 2. rowspan : 다른 ..

특정 요소에 하나의 요소를 추가한다 1. ::first-line : 해당 가상 요소는 텍스트의 첫번째 줄에만 특정 스타일을 입혀준다. 문장의 첫 줄은 상위 요소의 크기나 브라우저의 크기에 따라 달라질 수 있다 p::first-line { color: #ff0000; font-variant: small-caps; } 2. ::first-letter : 텍스트의 첫 문자에 특정 스타일을 입혀준다. p::first-letter { color: #ff0000; font-size: xx-large; 3. ::before / ::after 요소의 내용에 추가된다 보통 이미지나 글자, 그라데이션 등을 추가할때 사용한다 h1::before { content: 'hello'; } h1::after { content: u..

앵커 가상 클래스 앵커 가상 클래스는 화면의 특정 요소에 커서가 향했을 때 특정 디자인을 입혀주는 등 어떤 요소에 동적인 스타일을 입혀준다. 앵커 가상 클래스에서 가장 자주 쓰이는 패턴이다. :link는 아직 방문하지 않은 링크를 나타낸다. 다음을 사용해서 아직 방문하지 않은 링크를 파란색으로, 방문한 링크는 밑줄 없이 보라색으로 표현할 수 있다. a:link { color: blue; } a:visited { color:purple; text-decoration: none; } 몇가지 앵커 가상 클래스는 사용자의 행동에 영향을 받는다. a:hover { color: red; } a:active { color: gray; } a:focus { color: yellow; } :hover : 사용자가 해당 ..

텍스트가 해당 요소의 범위를 넘어갈경우 표현 여부를 설정하며 다음과 같은 조건이 있다 1. overflow값이 hidden / auto / scroll 값이여야 한다 2. white-space 값이 nowrap 또는 텍스트가 다음 줄로 이동되지 않는 경우 - clip : 넘어간 범위의 텍스트를 자른다 - ellipse : 넘어간 범위의 텍스트를 "..." 기호로 대신 표현한다

해당 요소의 3D 좌표상에서의 원근법을 설정하기 위한 기능으로 기본적으로 해당 요소의 부모 요소에 transform-style / perspective 속성을 추가한다 perspective에 대입하는 값은 관찰자가 z축을 기준으로 설정된 거리만큼 떨어져 있다고 가정한 값이다 ex) perspective: 300px일때 -> 관잘차는 요소에 300px만큼 떨어진 거리에서 보고 있다고 가정 또는 특정 요소에만 원근법 속성을 적용시키려면 transform: perspective(300px); 위에 처럼 transform 속성에 perspective 속성을 대입한다

요소 안의 내용이 최대 크기를 벗어날때 어떻게 보여질지를 설정한다 1. visible : 내용이 최대 크기 범위에서 벗어날경우 그대로 보여지게 한다 2. hidden : 벗어난 내용은 보여지지 않는다 3. scroll : 스크롤바를 추가해 범위에서 벗어난 내용들을 스크롤을 이용해서 보여지게 한다 4. auto : 내용에 따라서 자동으로 결정된다

글의 들여쓰기 / 내어쓰기를 지정한다 값이 양수이면 들여쓰기, 음수이면 내어쓰기로 설정된다