Skip to main content

CodeScript Landing Page


CodeScript Landing Page



Sure! Here's an example code script for a blogging landing page:

html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>CodeScript Blog</title>
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <header>
    <div class="logo">
      <h1>CodeScript Blog</h1>
    </div>
    <nav>
      <ul>
        <li><a href="#">Home</a></li>
        <li><a href="#">About</a></li>
        <li><a href="#">Blog</a></li>
        <li><a href="#">Contact</a></li>
      </ul>
    </nav>
  </header>

  <main>
    <div class="hero">
      <h2>Welcome to CodeScript Blog</h2>
      <p>Get the latest tips, tutorials, and news about coding.</p>
      <a href="#" class="btn-primary">Read the Blog</a>
    </div>

    <section class="featured-posts">
      <h2>Featured Posts</h2>
      <div class="post">
        <img src="img/post1.jpg" alt="Post 1">
        <h3>How to Write Clean Code</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vestibulum ante at odio bibendum aliquet. Sed quis ornare felis, ac bibendum felis.</p>
        <a href="#" class="btn-secondary">Read More</a>
      </div>
      <div class="post">
        <img src="img/post2.jpg" alt="Post 2">
        <h3>10 Tips for Debugging Your Code</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vestibulum ante at odio bibendum aliquet. Sed quis ornare felis, ac bibendum felis.</p>
        <a href="#" class="btn-secondary">Read More</a>
      </div>
      <div class="post">
        <img src="img/post3.jpg" alt="Post 3">
        <h3>The Future of Artificial Intelligence</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vestibulum ante at odio bibendum aliquet. Sed quis ornare felis, ac bibendum felis.</p>
        <a href="#" class="btn-secondary">Read More</a>
      </div>
    </section>

    <section class="latest-posts">
      <h2>Latest Posts</h2>
      <div class="post">
        <img src="img/post4.jpg" alt="Post 4">
        <h3>Why You Should Learn Python</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vestibulum ante at odio bibendum aliquet. Sed quis ornare felis, ac bibendum felis.</p>
        <a href="#" class="btn-secondary">Read More</a>
      </div>
      <div class="post">
        <img src="img/post5.jpg" alt="Post 5">
        <h3>Top 5 Web Development Frameworks</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vestibulum ante at odio bibendum aliquet. Sed quis ornare felis, ac bibendum felis.</p>
Labels:

Comments

Post a Comment