Webleb - Snippet di Codice -

Video Pubblica il Tuo Codice

Consigliato

9 November 2024

Lettore di giochi Flash con emulatore Ruffle

index.html

<!DOCTYPE html>
<!DOCTYPE html>
<html lang="en">
<head>
  <title>Webleb</title>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />

styles.css

body {
  margin: 0;
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  height: 100vh;
}
.cards-container {
  position: relative;
  margin-top: 30px;
}
.cards-container h2 {
  font-size: 30px;
  text-align: center;
  color: #333;
  margin-bottom: 50px;
}
.card-body{
  text-align: center;
  margin: 30px;
}
.cards-container .owl-stage-outer {
  padding: 30px 0;
}
.cards-container .owl-nav {
  display: none;
}
.cards-container .owl-dots {
  text-align: center;
}
.cards-container .owl-dots span {
  position: relative;
  height: 10px;
  width: 10px;
  border-radius: 50%;
  display: block;
  background: #fff;
  border: 2px solid #01b0f8;
  margin: 0 5px;
}
.cards-container .owl-dots .active {
  box-shadow: none;
}
.cards-container .owl-dots .active span {
  background: #01b0f8;
  box-shadow: none;
  height: 12px;
  width: 12px;
  margin-bottom: -1px;
}
.cards-container .card {
  background: #fff;
  box-shadow: 0 8px 30px -7px #c9dff0;
  margin: 0 20px;
  padding: 0 10px;
  border-radius: 20px;
  border: 0;
}
.cards-container .card .card-img-top {
  max-width: 100px;
  border-radius: 50%;
  margin: 15px auto 0;
  box-shadow: 0 8px 20px -4px #95abbb;
  width: 100px;
  height: 100px;
}
.cards-container .card h5 {
  color: #01b0f8;
  font-size: 21px;
  line-height: 1.3;
}
.cards-container .card h5 span {
  font-size: 18px;
  color: #666;
}
.cards-container .card p {
  font-size: 14px;
  color: #555;
  padding-bottom: 15px;
}
.cards-container .active {
  opacity: 0.5;
  transition: all 0.3s;
}
.cards-container .center {
  opacity: 1;
}
.cards-container .center h5 {
  font-size: 24px;
}
.cards-container .center h5 span {
  font-size: 20px;
}
.cards-container .center .card-img-top {
  max-width: 100%;
  height: 120px;
  width: 120px;
}
@media (max-width: 767px) {
  .cards-container {
    margin-top: 20px;
 }
}
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev {
  outline: 0;
}
.owl-carousel button.owl-dot {
  outline: 0;
}

Consigliato

Barra di navigazione

Un codice di Metehan

Lettore di giochi Flash con emulatore Ruffle

index.html

styles.css

main.js

Consigliato

Barra di navigazione

Un codice di Metehan

Lettore di giochi Flash con emulatore Ruffle

index.htmlCopy

styles.cssCopy

main.js Copy

index.html

styles.css

main.js