Top Restaurant
<!-- ===== TinyMCE-Compatible Content ===== -->
<header>
<h1>Full HTML Example Page</h1>
<p>All standard HTML tags included for TinyMCE editor</p>
</header>
<nav>
<ul>
<li><a href="#section1">Home</a></li>
<li><a href="#section2">About</a></li>
<li><a href="#section3">Services</a></li>
<li><a href="#section4">Gallery</a></li>
<li><a href="#section5">Contact</a></li>
</ul>
</nav>
<main>
<!-- Sections -->
<section id="section1">
<h2>Introduction</h2>
<p>This is a full HTML page example showing all common tags: headings, paragraphs, lists, tables, forms, images, figures, code blocks, scripts, and more.</p>
<img src="https://via.placeholder.com/600x200" alt="Placeholder Image" style="max-width:100%; border-radius:8px;">
<figure>
<img src="https://via.placeholder.com/300x150" alt="Figure Example">
<figcaption>Figure 1: Example caption</figcaption>
</figure>
</section>
<section id="section2">
<h2>Lists Example</h2>
<ul>
<li>Unordered List Item 1</li>
<li>Unordered List Item 2
<ul>
<li>Nested Item A</li>
<li>Nested Item B</li>
</ul>
</li>
<li>Unordered List Item 3</li>
</ul>
<ol>
<li>Ordered List Item 1</li>
<li>Ordered List Item 2</li>
<li>Ordered List Item 3</li>
</ol>
</section>
<section id="section3">
<h2>Tables & Forms</h2>
<table style="width:100%; border-collapse: collapse; border:1px solid #333;">
<thead>
<tr>
<th>Name</th>
<th>Email</th>
<th>Role</th>
</tr>
</thead>
<tbody>
<tr>
<td>John Doe</td>
<td>john@example.com</td>
<td>Admin</td>
</tr>
<tr>
<td>Jane Smith</td>
<td>jane@example.com</td>
<td>Editor</td>
</tr>
</tbody>
</table>
<form action="#" method="POST">
<label for="name">Name:</label>
<input type="text" id="name" name="name" placeholder="Enter Name">
<label for="email">Email:</label>
<input type="email" id="email" name="email" placeholder="Enter Email">
<label for="role">Role:</label>
<select id="role" name="role">
<option value="admin">Admin</option>
<option value="editor">Editor</option>
<option value="contributor">Contributor</option>
</select>
<label for="message">Message:</label>
<textarea id="message" name="message" rows="4" placeholder="Write a message"></textarea>
<button type="submit">Submit</button>
</form>
</section>
<section id="section4">
<h2>Grid & Code Example</h2>
<div style="display:grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap:10px;">
<div style="padding:20px; background:#28a745; color:#fff; text-align:center; border-radius:5px;">Grid 1</div>
<div style="padding:20px; background:#28a745; color:#fff; text-align:center; border-radius:5px;">Grid 2</div>
<div style="padding:20px; background:#28a745; color:#fff; text-align:center; border-radius:5px;">Grid 3</div>
<div style="padding:20px; background:#28a745; color:#fff; text-align:center; border-radius:5px;">Grid 4</div>
</div>
<pre>
<!-- JavaScript Code Example -->
function greet(name) {
console.log('Hello, ' + name + '!');
}
greet('Visitor');
</pre>
</section>
<section id="section5">
<h2>Contact & Miscellaneous Tags</h2>
<address>
123 Main Street, Example City, Country<br>
Email: <a href="mailto:info@example.com">info@example.com</a><br>
Phone: <a href="tel:+1234567890">+1234567890</a>
</address>
<details>
<summary>More Information</summary>
<p>This content is hidden until you click the summary above.</p>
</details>
<mark>This text is highlighted using <mark> tag.</mark>
<abbr title="Hypertext Markup Language"><HTML></abbr>
</section>
</main>
<aside>
<h3>Sidebar Example</h3>
<p>This is an aside section for additional content or links.</p>
</aside>
<footer>
<p>© 2026 Full HTML Example. All Rights Reserved.</p>
</footer>
<script>
// Example JavaScript
console.log('Full HTML example page loaded.');
</script>