0 added
0 removed
Original
2026-01-01
Modified
2026-03-09
1
<p>HTML</p>
1
<p>HTML</p>
2
<p><!DOCTYPE html> <html lang="en"> <head> <title>Buttons - Part 2</title> <meta charset="utf-8"> <link rel="stylesheet" href="style.css"> </head> <body> <button class="button simple-gray">Come</button><br> <button class="button strong-brown">See</button><br> <button class="button glossy-blue">Conquer</button> </body> </html></p>
2
<p><!DOCTYPE html> <html lang="en"> <head> <title>Buttons - Part 2</title> <meta charset="utf-8"> <link rel="stylesheet" href="style.css"> </head> <body> <button class="button simple-gray">Come</button><br> <button class="button strong-brown">See</button><br> <button class="button glossy-blue">Conquer</button> </body> </html></p>
3
<p>CSS</p>
3
<p>CSS</p>
4
<p>.simple-gray { background-image: linear-gradient(#ffffff, #dddddd); color: #333333; } .strong-brown { background-image: none; color: #ffffff; } .glossy-blue { background-image: none; color: #ffffff; } .button { display: inline-block; margin: 20px; padding: 20px 50px; border-radius: 5px; border: none; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2), 0 1px 3px #aaaaaa; text-align: center; text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.4); font-size: 24px; font-family: "Lucida Grande", "Arial", sans-serif; line-height: 25px; } html, body { margin: 0; padding: 0; padding-top: 50px; text-align: center; }</p>
4
<p>.simple-gray { background-image: linear-gradient(#ffffff, #dddddd); color: #333333; } .strong-brown { background-image: none; color: #ffffff; } .glossy-blue { background-image: none; color: #ffffff; } .button { display: inline-block; margin: 20px; padding: 20px 50px; border-radius: 5px; border: none; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2), 0 1px 3px #aaaaaa; text-align: center; text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.4); font-size: 24px; font-family: "Lucida Grande", "Arial", sans-serif; line-height: 25px; } html, body { margin: 0; padding: 0; padding-top: 50px; text-align: center; }</p>