아래에서 볼 수 있듯이 웹 페이지에서 HTML과 CSS를 사용하여 텍스트 주위에 테두리를 만들 수 있습니다. 아래 예제에서는 단락 ()을 빨간색 테두리로 묶었습니다.
빨간색 테두리로 둘러싸인 텍스트가있는 첫 번째 예제입니다.
이 예제에는 여러 줄이 있습니다.
위의 예를 만들려면 아래 코드가 사용되었습니다.
빨간색 테두리로 둘러싸인 텍스트가있는 첫 번째 예제입니다.
이 예제에는 여러 줄이 있습니다.
위의 코드에서 스타일은 테두리 크기 (픽셀의 짧은 픽셀), 스타일 유형 및 테두리 색상을 정의합니다. 테두리의 스타일은 테두리가 화면에 나타나는 방식입니다. 경계 유형의 다른 유형에는 점선, 점선, 이중, 그루브, 융기, 삽입 및 시작이 포함됩니다. 테두리 색상은 테두리에 사용할 색상을 정의합니다. 위의 예에서 빨간색의 색상 코드 인 # FF0000이라는 색상 코드가 사용되었습니다.
CSS를 사용하여 스타일 정의하기
웹 페이지의 요소 모양은 인라인 CSS로 정의 할 수도 있습니다. 인라인 CSS는 HTML 문서의 요소에 정의됩니다. 또는 확장자가 .css 인 외부 파일에서 CSS를 정의 할 수 있습니다. 그런 다음 HTML 문서에서이 파일에 링크 할 수 있으며 해당 문서의 요소는 CSS 스타일에 액세스 할 수 있습니다. 예를 들어 아래의 CSS 코드를 사용하면 다른 HTML 태그에 적용 할 수있는 "borderexample"이라는 새 클래스가 만들어집니다.
. 보르 드 샘플 {border-style : solid; border-color : # 287EC7; }
위의 코드를 사용하여이 단락 스타일을 HTML 단락에 적용하려면 아래 예와 비슷한 내용을 입력 할 수 있습니다.
다음은 CSS를 사용하여 만든 테두리의 예입니다.