الطريقة الأسهل والأفضل هي إضافته ضِمن وسم <div> </div>
حيثُ يُصبح كود الفريم على الشكل التالي:
<!DOCTYPE html>
<html>
<head>
<title>Block and Inline elements</title>
<meta charset=UTF-8/>
<style>
#frame {
text-align: center;
}
</style>
</head>
<body>
<div style="background-color:black;color:white;padding:20px;text-align:center;">
<h1>Neovka</h1>
<p>It's a site where you can earn lots of <span style="color:#4CAF50">Money</span> online by shortning links and share it with people</p>
</div>
<div id='frame'>
<iframe src="" height="200" width="300" name="a"></iframe><br>
</div>
<a href = "http://www.w3schools.com" target="a">W3schools.com</a><br>
<a href = "http://devilsfruits.blogspot.com" target="a">Devil's Fruit Blogspot</a>
</body>
</html>
التغييرات التي حصلت
قُمنا بإضافة وسم
<div id='frame'>
....
....
....
</div>
وقُمنا بإضافته لكود CSS مع إضافة كود
text-align: center;
حيثُ أنّه أصبح بإمكانك تغيير center بـ (right, left)
وإذا أردت الفريم غير مُلتصق بالهيدر يُمكنك إضافة margin-top: 12px; في كود css إليه.