본문 바로가기

page setting

[css] header, footer 이미지 및 글씨체 수정

헤더 수정 : 이미지 첨부, 이미지 크기(높이 고정), contain :  잘림없이 비율유지 (프레임 없이 전체 덮으려면 cover), 색상, overflow : 크기가 넘어가도 보여짐

#header {

  background-image:url(./images/temp.jpg);

  width: device-width;

  height: 330px;

  background-repeat: no-repeat;

  background-position: center;

  background-size: contain;

  background-color: #3f3f3f;

  overflow: visible;

}

 

<a> 태그 수정 : 타이틀 글씨체 수정

#header h1 a {

  display: inline-block;

  text-decoration: none;

  vertical-align: top;

  font-style: italic;

  font-family: Times New Roman;

  color: #d3d3d3;

}

 

footer 수정 : 배경색상, footer 글씨체 수정

#footer {

  position: relative;

  padding: 29px 0;

  border-top: 1px solid #ebebeb;

  background-color: #3f3f3f;

  font-family: Times New Roman;

  font-style: italic;

  font-weight: bold;

}

색상표 1
색상표 2

 

img ref : https://encycolorpedia.kr/808080