CSS3 다른

이 튜토리얼에서 우리는 더 많은 흥미로운 CSS3기능.

CSS를 사용하여3사용자 인터페이스 확장

이 장에서 우리가 논의할 몇 가지 흥미로운 사용자 인터페이스 관련 CSS3속성과 마찬가지로resize,outline-offset와 같이 사용할 수 있으며, 이를 통해 웹 페이지를 개선할 수 있습니다.

원소 크기를 조정

CSS를 사용하여3 resize 속성은 원소를 수직, 수평 또는 양방향으로 조정할 수 있습니다. 그러나 이 속성은 일반적으로 다음과 같은 목적로 사용됩니다.<textarea>폼 컨트롤러에서 기본적으로 조정 가능한 행동을 제거합니다.

p, div, textarea　{
　　　　width:　300px;
　　　　min-height:　100px;
　　　　overflow: auto;
　　　　border:　1px solid black;
}
p　{
　　　resize: horizontal;　
}
div　{
　　　　resize: both;
}
textarea　{
　　　　resize: none;
}

테두리 이동 설정

이전 장에서는 테두리에 다양한 속성을 설정하는 방법을 배웠습니다. 예를 들어, 너비, 색상, 스타일 등이지만, CSS3또 다른 속성, outline-offset은 원소의 테두리와 원소의 테두리 간의 공간을 설정하는 데 사용됩니다. 이 속성은 음수 값을 받을 수 있으며, 이는 원소 내에 테두리를 배치할 수도 있음을 의미합니다.

p, div　{
　　　　margin:　50px;
　　　　height:　100px;
　　　　background: #000;
　　　　outline:　2px solid red;
}
p　{
　　　　outline-offset:　10px;
}
div　{
　　　　outline-offset:　-15px;
}