> 웹 프론트엔드 > CSS 튜토리얼 > CSS에서 점선을 설정하는 방법

CSS에서 점선을 설정하는 방법

藏色散人
풀어 주다: 2022-12-30 11:13:04
원래의
30176명이 탐색했습니다.

CSS에서 점선을 설정하는 방법: 1.

태그를 만든 다음 CSS 스타일을 div에 "border-bottom:red 1px dashed;"로 추가합니다. hr 태그를 추가한 다음 hr 태그 속성에 테두리를 추가하면 점선 효과를 얻을 수 있습니다.

이 문서의 데모 환경: Acer S40-51, Windows10 Home Chinese Edition, HTML5&&CSS3&&HBuilderX.3.0.5.

추천: "css 비디오 튜토리얼"

css에서 점선을 설정하는 방법

점선 테두리를 설정하여 점선 설정:

  • HTML에서

    점선으로 설정할 수 있습니다.

    먼저

    태그를 생성할 수 있습니다:
    <div class="xuxian"></div>
    로그인 후 복사

    그런 다음 테두리 높이를 0으로 설정하고 위쪽 테두리 또는 아래쪽 테두리를 1픽셀 점선으로 설정합니다.

    자세한 내용은 다음과 같습니다.

    .xuxian{
    width:100%;
    height:0;
    border-bottom:red 1px dashed;}
    /*red表示虚线的颜色为红色,1px表示边框宽度为一个像素,dashed表示边框线型为虚线*/
    로그인 후 복사

    Rendering:

    CSS에서 점선을 설정하는 방법

    • HTML에서는 hr 태그에 CSS 스타일을 설정하여 점선 효과를 얻을 수도 있습니다.

    css 코드:

    hr{border:blue 1px dashed}
    로그인 후 복사

    렌더링:

    CSS에서 점선을 설정하는 방법

    전체 코드는 다음과 같습니다.

    
    
    
        
        css设置虚线
    
    
    
    
    
    <div class="xuxian"></div>
    
    로그인 후 복사

    더 많은 컴퓨터 프로그래밍 관련 지식을 보려면 프로그래밍 교육을 방문하세요! !

위 내용은 CSS에서 점선을 설정하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
css
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿