復習課題 - 手打ちで始めるweb制作

Q11

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>お問い合わせ</title>
<style>
body,p {
  margin: 0;
  padding: 0;
}
a {
  text-decoration: none;
}
a:link{ 
  color: #0000ff;
}
a:visited{
  color: #800080;
}
a:hover{
  color: #ff4500;
}
a:active{
  color: #ff4500;
}

</style>
</head>
<body>
<p>お問い合わせはこちらになります。<br>
<a href="http://www.felica.co.jp">http://www.felica.co.jp</a>
</p>
</body>
</html>

Q12

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>ボタン</title>
<link rel="stylesheet" href="style1.css">
</head>
<body>
<ul>
<li><a href="#">a-link-skyblue</a></li>
<li><a href="#">a-visited-turquise</a></li>
<li><a href="#">a-hover-coral</a></li>
<li><a href="#">a-active-lawngreen</a></li>
</ul>
</body>
</html>

@charset "UTF-8";

body,ul,li{
  margin: 0; 
  padding: 0;
}

body{
  font-family:
    "Hiragino Kaku Gothic ProN",
    Meiryo,
    sans-serif;
}

ul{
  list-style: none;
}

li a {
  text-decoration: none;
  display: block;
  color: #ffffff;
  margin-bottom: 1px;
  width: 200px;


  
  }
li a:link{ 
  background-color: skyblue;
}
li a:visited{
   background-color: turquoise;
}
li a:hover{
   background-color: coral;
}
li a:active{
   background-color: lawngreen;
}