Rumah >hujung hadapan web >tutorial css >Petua untuk menggunakan h1 tag_Experience exchange
Petua untuk menggunakan h1 tag_Experience exchange
- PHP中文网asal
- 2016-05-16 12:06:481801semak imbas
Penggunaan tag h1 yang betul boleh mencapai tujuan SEO, jadi bagaimana untuk menggunakan tag h1 tanpa kehilangan kecantikan asal? Malah, dengan menggunakan tag h1 dengan betul, kita boleh mencapai kedua-dua tujuan SEO dan estetik. Semua orang tahu bahawa enjin carian lebih suka tag h1. Tag h1 juga merupakan langkah yang sangat asas dan penting dalam SEO. Tetapi kadang-kadang demi gaya antara muka, banyak teks tajuk dijadikan gambar. Dalam kebanyakan kes, imej digunakan secara langsung semasa memotong halaman. Dari segi kod, tag h1 akan kehilangan kesannya pada enjin carian.
Malah, dengan sedikit pelarasan, anda boleh menjaga kedua-duanya. Kami memerlukan dua gambar:
1 
2 
Lihat perenggan ini. Teg h1 masih boleh dibaca oleh enjin carian, kami hanya menggunakan text-indent:-9999px untuk membuang teks "Jemput rakan untuk menyertai" jauh ke kiri.
Kodnya adalah seperti berikut:
<style>
.test{}
.test h1{margin:0; padding:0; text-indent:-9999px; width:522px; height:45px;
background:url(header.gif) no-repeat;}
.testbox{background:url(bg.gif); width:522px; height:323px;}
</style>
<div class="test">
<h1>邀请好友加入</h1>
</div>
<div class="testbox"></div><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>h1标签的使用</title>
<style>
.test{}
.test h1{margin:0; padding:0; text-indent:-9999px; width:522px; height:45px;
background:url(/upload/20071124114047865.gif) no-repeat;}
.testbox{background:url(/upload/20071124114047678.gif); width:522px; height:323px;}
</style>
</head>
<body>
正确使用h1标签，兼顾美观与seo.
<div class="test">
<h1>邀请好友加入</h1>
</div>
<div class="testbox"></div>
</body>
</html>
Tag h1 juga boleh digunakan seperti ini, daripada sudah tentu anda juga boleh menggunakan tag h1 Gunakan gaya seperti saiz fon, warna fon, dll. Sudah tentu, seperti contoh di atas, hanya untuk mencapai tujuan SEO, tidak perlu menggunakan gaya untuk mengubah suai tag h1, kerana apa yang dipaparkan di hadapan pengguna ialah gambar.
Di atas ialah kandungan pertukaran kemahiran_pengalaman penggunaan tag h1 Untuk kandungan yang lebih berkaitan, sila perhatikan laman web PHP Cina (www.php.cn)!