Blogger Pe Sample download HTML button kaise banaen
Aap ek Download Button HTML aur CSS ka use karke asaan tarike se bana sakte hain. Niche ek basic example diya gaya hai:
Basic HTML Download Button:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Download Button</title>
</head>
<body>
<!-- Download Button -->
<a href="sample.pdf" download>
<button>Download Sample</button>
</a>
</body>
</html>
Stylish Download Button (HTML + CSS):
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Stylish Download Button</title>
<style>
.download-btn {
display: inline-block;
background-color: #4CAF50; /* Green */
color: white;
padding: 10px 20px;
font-size: 16px;
text-decoration: none;
border-radius: 5px;
border: none;
cursor: pointer;
transition: background-color 0.3s ease;
}
.download-btn:hover {
background-color: #45a049; /* Darker Green */
}
</style>
</head>
<body>
<!-- Stylish Download Button -->
<a href="sample.pdf" download class="download-btn">Download Sample</a>
</body>
</html>
Explanation:
-
href="sample.pdf":
Yahansample.pdfek file ka naam hai jo same folder me hona chahiye. Is file ko download kiya jayega. -
downloadAttribute:
Ye browser ko batata hai ki file ko direct download karna hai. -
CSS Styling:
- Button ka background, color, padding, aur hover effect CSS se control hota hai.
Agar aap kisi specific file type (e.g., MP3, ZIP) ke liye button chahte hain ya alag design chahte hain, toh mujhe batayein!
Download Sample