• 목록

이번에 포스팅할 내용은 h1/h2/h3 을 css 를 이용해 조금 이쁘게 꾸미는 코드를 알게되어 기록형으로 남깁니다.

 

[code]

<style>

h1{

  padding: 10px;

  /*  상자내무 간격 사방 10  */

  border:5px double #848484;

  /*  라인 색상,굵기,선종류 설정가능  */

  border-radius:10px;

  /*  테두리 둥근처리 숫자로 조정가능  */

}

h2{

  padding: 5px 10px;

/*  상자내무 간격 : 위아래 5px, 오른쪽왼쪽 15px  */

  border-bottom:1px solid #848484;

/*  밑줄 라인 색상,굵기,선종류 설정가능  */

  border-left:8px solid #848484;

 /*  왼쪽 라인 색상,굵기,선종류 설정가능  */

}

h3{

  padding: 5px 15px;

/*  상자내부 간격 : 위아래 5px, 오른쪽왼쪽 15px  */

  background: #eee;

/* 배경색 컬러코드로 변경가능   */

  border-radius: 10px;

/*  테두리 둥근처리 숫자로 조정가능  */

  font-size: 1.1rem;

/*  숫자로 폰트크기 조절가능  */

}

</style>

[/code]

 

출처는 잘 모르겠습니다.