私はちょうど写真で私の問題を説明します。 https://snag.gy/jIilU4.jpg このテキスト装飾を離れる解決策はありますか?私はtext-decoration:noneを追加しようとしました。それは私のためには機能しません。私はかなり簡単に説明することができますが、私はCSSでかなり新しいです。CSS3 a:-webkit-any-linkから下線を取り除く方法
body {
background-image: url(img/bg.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
background-position: top;
max-width: 100%;
height: auto;
background-size: cover;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
a:hover:not(.active) {
background-color: #111;
}
.active {
background-color: #4CAF50;
}
.logo {
text-align: center;
}
.logo img {
height: auto;
width: auto;
max-width: 300px;
max-height: 300px;
overflow: hidden;
transition-duration: 0.8s;
transition-property: transform;
}
.logo img:hover {
transform: rotate(360deg);
-webkit-transform: rotate(360deg);
}
.logo a {
text-decoration: none;
}
#slideshow {
margin: 0 auto;
position: relative;
width: 240px;
height: 240px;
padding: 10px;
display: box;
flex-align: center;
flex-pack: center;
}
#slideshow > div {
position: absolute;
top: 10px;
left: 10px;
right: 10px;
bottom: 10px;
}
HTMLコードがあります:
<!DOCTYPE html>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<head>
<title>How to align the items of the flexible element</title>
<link rel="stylesheet" type="text/css" href="css/styles.css" />
</head>
<body>
<div class="menu">
<ul>
<li><a class="active" href="#home">Home</a></li>
<li><a href="#contact">Account</a></li>
<li><a href="#about">Library</a></li>
<li><a href="#about">Download</a></li>
<li><a href="#about">Community</a></li>
<li><a href="#about">Highscores</a></li>
<li><a href="#about">Premium</a></li>
<li><a href="#about">Forum</a></li>
</ul>
</div>
<div class="logo">
<a href="/" title="Medivia Online">
<img src="css/img/medivia.png" alt="Medivia Logo">
</a>
</div>
<div style="width:800px; margin:0 auto;" id="slideshow">
<div>
<img src="css/img/chimera.png">
</div>
<div>
<img src="css/img/queens_follower.png">
</div>
<div>
<img src="css/img/player_killing.png">
</div>
<div>
<img src="css/img/general.png">
</div>
<div>
<img src="css/img/hydra.png">
</div>
<div>
<img src="css/img/ogre_death.png">
</div>
<div>
<img src="css/img/raid.png">
</div>
<div>
<img src="css/img/icenhaal.png">
</div>
</div>
<script src="js/jquery-3.1.1.min.js">
</script>
<script>
$("#slideshow > div:gt(0)").hide();
setInterval(function() {
$('#slideshow > div:first')
.fadeOut(1000)
.next()
.fadeIn(1000)
.end()
.appendTo('#slideshow');
}, 3000);
</script>
</body>
コード全体を投稿してください(htmlがありません) – Chris