2019. 2. 12. 23:20ㆍFront End 강의내용
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
h2{
text-align: center;
}
ol{
list-style-type: none;
/* 리스트 숫자 없애기 */
}
ol li{
padding: 20px;
color: #fff;
}
ol li:nth-child(odd){
background-color: teal;
}
/* 홀수번째 적용*/
ol li:nth-child(even){
background-color: cadetblue;
}
/* 짝수번째 적용*/
ol li:last-child{
text-decoration: line-through;
}
/* 마지막꺼 적용*/
ol li:first-child{
background-color: gold;
}
/* 첫번째거 적용*/
</style>
</head>
<body>
<h2>Top 5 Programming Languages</h2>
<ol>
<li>Javascript</li>
<li>Python</li>
<li>C++</li>
<li>GO</li>
<li>Java</li>
</ol>
</body>
</html>
'Front End 강의내용' 카테고리의 다른 글
125강. ::before, ::after 적용 (0) | 2019.02.13 |
---|---|
124강. ::first-letter, ::first-line, ::selector 적용 (0) | 2019.02.13 |
122강. only-of-type 적용 (0) | 2019.02.12 |
116강. opacity 적용 (0) | 2019.02.12 |
115강. Dropdown 기능 <The Front End Web Developer / Udemy 강의> (0) | 2019.02.11 |