<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src ="../js/jquery-3.2.1.js"></script>
</head>
<script>
$(function(){
$('li').css('display','inline')
.css('float','left')
.css('width','100px')
.css('height','60px')
.css('text-align','center')
.css('line-height','60px');
$('li:nth-child(2n+1)').css('background','hotpink');
$('li:nth-child(2n)').css('background','orange');
$('li:nth-child(1)').css('border-top-left-radius','8px')
.css('border-bottom-left-radius','8px');
$('li:nth-child(7)').css('border-top-right-radius','8px')
.css('border-bottom-right-radius','8px');
});
</script>
<body>
<ul>
<li>First</li>
<li>Second</li>
<li>Third</li>
<li>Fourth</li>
<li>Fifth</li>
<li>Sixth</li>
<li>Seventh</li>
</ul>
<p>꿈툴이입니다.</p>
</body>
</html>
' sundries' 카테고리의 다른 글
2-2 filter() (0) | 2018.01.12 |
---|---|
2-1 필터 선택자 요소 콜론 (0) | 2018.01.12 |
1-22 jQuery 충돌 방지 (0) | 2018.01.11 |
1-21 클래스 속성 $.each (0) | 2018.01.11 |
1-21 클래스 속성 추가 each (0) | 2018.01.11 |