<!DOCTYPE html>
<
html
lang
=
"en"
>
<
head
>
<
title
> Foundation CSS Orbit </
title
>
<
link
rel
=
"stylesheet"
href
=
<
script
src
=
</
script
>
<
script
src
=
</
script
>
<
link
rel
=
"stylesheet"
href
=
"style.css"
>
</
head
>
<
body
>
<
center
>
<
h2
style
=
"color:green;"
> GeeksforGeeks </
h2
>
<
strong
> Foundation CSS Orbit </
strong
>
</
center
>
<
div
class
=
"orbit"
role
=
"region"
data-orbit
data-use-m-u-i
=
"false"
>
<
ul
class
=
"orbit-container"
>
<
button
class
=
"orbit-previous"
aria-label
=
"previous"
>
<
span
class
=
"show-for-sr"
> Previous </
span
>
</
button
>
<
button
class
=
"orbit-next"
aria-label
=
"next"
>
<
span
class
=
"show-for-sr"
> Next </
span
>
</
button
>
<
li
class
=
"is-active orbit-slide"
>
<
div
>
<
h3
class
=
"text-center"
> GFG slide 1 </
h3
>
<
p
class
=
"text-center"
>
A Computer Science portal for geeks.
It contains well written, well thought
and well explained computer science and
programming articles
</
p
>
</
div
>
</
li
>
<
li
class
=
"orbit-slide"
>
<
div
>
<
h3
class
=
"text-center"
> GFG slide 2 </
h3
>
<
p
class
=
"text-center"
>
GeeksforGeeks.org was created with
a goal in mind to provide well written,
well thought and well explained solutions
for selected questions.
</
p
>
</
div
>
</
li
>
<
li
class
=
"orbit-slide"
>
<
div
>
<
h3
class
=
"text-center"
> GFG slide 3 </
h3
>
<
p
class
=
"text-center"
>
It contains well written, well thought
and well explained computer science and
programming articles. A Computer Science
portal for geeks.
</
p
>
</
div
>
</
li
>
</
ul
>
<
nav
class
=
"orbit-bullets"
>
<
button
class
=
"is-active"
data-slide
=
"0"
>
<
span
class
=
"show-for-sr"
>slide 1 </
span
>
<
span
class
=
"show-for-sr"
> Current Slide </
span
>
</
button
>
<
button
data-slide
=
"1"
>
<
span
class
=
"show-for-sr"
>slide 2 </
span
>
</
button
>
<
button
data-slide
=
"2"
>
<
span
class
=
"show-for-sr"
>slide 3 </
span
>
</
button
>
</
nav
>
</
div
>
<
script
>
$(document).foundation();
</
script
>
</
body
>
</
html
>