Jinsi ya Kutengeneza Portfolio Page kwa HTML & CSS
💻 Full Working Code
📁 portfolio.html
<!DOCTYPE html>
<html lang="sw">
<head>
<meta charset="UTF-8">
<title>Portfolio - Faulink</title>
<style>
body { font-family: Arial; background: #fff; margin: 0; text-align: center; }
header { background: #007bff; color: white; padding: 20px; }
.gallery { display: flex; flex-wrap: wrap; justify-content: center; padding: 20px; }
.gallery img {
width: 250px; height: 180px; object-fit: cover; border-radius: 10px;
margin: 10px; transition: 0.3s;
}
.gallery img:hover { transform: scale(1.05); }
</style>
</head>
<body>
<header><h1>Portfolio ya Kazi Zetu</h1></header>
<div class="gallery">
<img src="https://via.placeholder.com/250x180" alt="Project 1">
<img src="https://via.placeholder.com/250x180" alt="Project 2">
<img src="https://via.placeholder.com/250x180" alt="Project 3">
<img src="https://via.placeholder.com/250x180" alt="Project 4">
</div>
</body>
</html>
________________________________________
🎥 YouTube Description
Somo hili linafundisha jinsi ya kutengeneza Portfolio Page kwa kutumia HTML na CSS pekee.
Utaona jinsi ya kupanga picha za miradi yako kwa layout ya kisasa na hover effect.
💡 Bora kwa web developers, designers, na freelancers wanaotaka kuonyesha kazi zao mtandaoni.
🔔 Subscribe kwenye Faulink Channel
________________________________________
🏷️ Hashtags
#HTML #CSS #Portfolio #Faulink #WebDesign #Gallery #Coding #ResponsiveDesign
🚀 Unahitaji mfumo au website ya biashara?
Chagua huduma hapa chini kisha mteja bofya moja kwa moja kwenda kwenye ukurasa wa huduma au kuwasiliana nasi kwa WhatsApp.