-
질문 & 답변
카테고리
-
세부 분야
웹 개발
-
해결 여부
미해결
왜 색이 안변하죠??
22.04.02 01:04 작성 조회수 107
0
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요!
- 먼저 유사한 질문이 있었는지 검색해보세요.
- 서로 예의를 지키며 존중하는 문화를 만들어가요.
- 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
- 먼저 유사한 질문이 있었는지 검색해보세요.
- 서로 예의를 지키며 존중하는 문화를 만들어가요.
- 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
//style.css
width: 100%;
height: 100%;
}
.bx-wrapper, .bx-viewport, .slider{
width: 100%;
height: 100%;
}
.background__01{
width: 100%;
height: 100%;
background: url("../images/a.jpg") no-repeat;
background-size: cover;
background-position: center;
}
.background__02{
width: 100%;
height: 100%;
background: url("../images/b.jpg") no-repeat;
background-size: cover;
background-position: center;
}
.background__03{
width: 100%;
height: 100%;
background: url("../images/c.png") no-repeat;
background-size: cover;
background-position: center;
}
.contents{
position: absolute;
top:0;
text-align: center;
}
.contents__name{
font-size: 64px;
font-weight: bold;
color :blanchedalmond;
margin-bottom: 25px;
}
.contents__job{
font-size: 25px;
font-weight: bold;
color : blanchedalmond;
margin-bottom: 50px;
}
.content__list{
font-size: 0;
}
.contents__list > li{
display: inline-block;
width:52px;
height: 52px;
border:1px solid white;
border-radius: 50%;
font-size: 16px;
}
.content__list > li > a{
color : white;
}
//index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Halfhalfman's Homepage</title>
<link href="css/reset.css" rel="stylesheet"
type="text/css"/>
<link href="css/style.css" rel="stylesheet"
type="text/css"/>
<script src="js/jquery.1.12.4.js"
type="text/javascript"></script>
<script src="plugins/bxslider/js/jquery.bxslider.js"
type="text/javascript"></script>
<script src="https://kit.fontawesome.com/2871c12638.js" crossorigin="anonymous"></script>
<script>
$(document).ready(function(){
$('.slider').bxSlider({
controls:false,
pager:false,
auto:true
});
});
</script>
</head>
<body>
<div class="slider">
<div class="background__01"></div>
<div class="background__02"></div>
<div class="background__03"></div>
</div>
<div class="contents">
<p class="contents__name">Halfhalfman</p>
<P class="contents__job">I live at korea, I am a student, I have my own NFT.</P>
<div class="contents__sns">
<ul class="contents__list">
<li>
<a href="#">
<i class="fa-brands fa-discord"></i>
</a>
</li>
<li>
<a href="#">
<i class="fa-solid fa-water"></i>
</a>
</li>
</ul>
</div>
</div>
</body>
</html>
답변을 작성해보세요.
답변 0