[HTML,CSS기초]5-2.디자인 추가하기(2)
결과물
주요 코드
<head>
<style>
@import url('https://fonts.googleapis.com/css2?family=Nanum+Pen+Script&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nanum+Pen+Script&display=swap');
</style>
</head>
#css
h1 span{
font-family: 'Nanum Pen Script', cursive;
background-color:yellow;
font-size: 50px;
}
p{
text-align: center;
font-family: 'Nanum Pen Script', cursive;
font-size: 20px;
}
<head>
<style>
@import url('https://fonts.googleapis.com/css2?family=Nanum+Pen+Script&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nanum+Pen+Script&display=swap');
</style>
</head>
#css
h1 span{
font-family: 'Nanum Pen Script', cursive;
background-color:yellow;
font-size: 50px;
}
p{
text-align: center;
font-family: 'Nanum Pen Script', cursive;
font-size: 20px;
}
: 글꼴 추가 코드
<div><h1><span>🐧자이언트</span> <span>펭</span> <span>TV🐧</span></h1></div>
h1 span:nth-child(1){
color:rgb(132, 132, 139)
}
h1 span:nth-child(2){
color:rgb(212, 67, 208)
}
h1 span:nth-child(3){
color:rgb(49, 148, 191)
}
:글자 마다 색깔 다르게 적용
Author And Source
이 문제에 관하여([HTML,CSS기초]5-2.디자인 추가하기(2)), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@sue06004/HTMLCSS기초5-2.디자인-추가하기2저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)