잡동사니에도 사랑을

[21.09.17] exam02(05_cssPositioning) - <a href="#">활용 본문

JAVA_EE/CSS

[21.09.17] exam02(05_cssPositioning) - <a href="#">활용

luvforjunk 2021. 9. 17. 18:45
728x90
반응형

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

<style type="text/css">

.paging {

        text-align: center;

}

.paging a {

        display: inline-block;

        padding: 5px 8px; /* top&bottom, left&right */

        border: 1px solid #ccc;

        background-color: beige;

        font-weight: bold;

}

</style>

</head>

<body>

        <p class="paging">

               <a href="#">1</a>

               <a href="#">2</a>

               <a href="#">3</a>

               <a href="#">4</a>

               <a href="#">5</a>

        </p>   

</body>

</html>

 

<!--

<a>태그에 URL을 쓰면 해당 페이지로 이동하고 싶다는 뜻이데,

<a>태그에 #을 쓰면 이동해야 할 주소가 없다는 뜻이다. 현재 페이지의 상단에 위치하게 된다

-->

 

결과창

 

728x90
반응형

'JAVA_EE > CSS' 카테고리의 다른 글

[21.09.17] exam04(05_cssPositioning) - float / text-align: justify(양쪽정렬)  (0) 2021.09.17
[21.09.17] exam03(05_cssPositioning)  (0) 2021.09.17
[21.09.16] exam01(05_cssPositioning) - inline / inline-block / block / none / hidden  (0) 2021.09.16
[21.09.16] exam05(04_cssBoxModel) -  (0) 2021.09.16
[21.09.16] exam04(04_cssBoxModel) -  (0) 2021.09.16
'JAVA_EE/CSS' Related Articles more