tRikSonic
Tema

HTML base Tag

Terakhir diperbarui : 24 Mei 2018 - 07.26

Tutorial HTML <base>

HTML base Tag - Belajar html <base>, html <base> berfungsi sebagai Penentu Url dasar dari sebuah dokumen. Maksudnya adalah kita dapat membuat dasar dari semua url atau link relative.
Penempatan element <base> harus di tempatkan di dalam elemen <head>. dan itupan hanya diperbolehkan menggunakan 1 elemen saja.
background html
Di dalam element <base> diikuti attribute href dan attribute target.
Penggunaan element <base> sangat tepat untuk blog / website yang mempunyai Fasilitas explorer data website misal: website / blog yang menggunakan Cpanel, karna dengan Cpanel kita bisa menentukan Folder dan sub folder yang kita tentukan.
Tips dan saran :
Untuk Pengguna Blogger.com, kita masih bisa mencoba trik tersebut dengan menggunakn fasilitas file hosting external, baik itu dropbox , sites.google.com dan lain sebagainya...
Saran : jika cara ini dirasa hanya memperlambat proses ngeblog, lebih baik jangan menggunakan trik ini. Karena jika salah penerapan, yang ada hanya membuat link dari url menjadi link mati atau url tidak ditemukan.

Contoh 1:

Metode berikut dengan menargetkan url sebuah image.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Demo Triksonic</title>
<base href='https://sites.google.com/site/untukpublictriksonic/' target='_blank'/>
</head>
<body>

<img alt='demo' src='gambar/base.png' title='demo' />      

</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Demo Triksonic</title>
<base href='https://sites.google.com/site/untukpublictriksonic/' target='_blank'/>
</head>
<body>

<img alt='demo' src='gambar/base.png' title='demo' />      

</body>
</html>

Contoh 2:

Metode berikut dengan menargetkan url sebuah Link.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Demo Triksonic</title>
<base href='http://triksonic.blogspot.com/' target='_blank'/>
</head>
<body>

<a href="2016/07/html-tag-a-belajar-element-a.html">
  html tag <code>a</code>  
</a>

</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Demo Triksonic</title>
<base href='http://triksonic.blogspot.com/' target='_blank'/>
</head>
<body>

<a href="2016/07/html-tag-a-belajar-element-a.html">
  html tag <code>a</code>  
</a>

</body>
</html>

Contoh 3:

Metode berikut dengan menargetkan url sebuah file audio.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Demo Triksonic</title>
<base href="https://sites.google.com/site/wp20zrt4/mp3/" target="_blank">  
</head>
<body>

<p><strong>Pastikan perangkat audio anda aktif</strong></p>
<audio src="guitar.mp3" controls="controls"></audio>
  
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Demo Triksonic</title>
<base href="https://sites.google.com/site/wp20zrt4/mp3/" target="_blank">  
</head>
<body>

<p><strong>Pastikan perangkat audio anda aktif</strong></p>
<audio src="guitar.mp3" controls="controls"></audio>
  
</body>
</html>

Atribut :

Attibute Value Deskripsi
href url url dasar dalam penentuan url relative
target
  1. _blank
  2. _parent
  3. _self
  4. _top
  5. framename
menentukan target dari sebuah url

Global Attributes:

Element <base> mencakup Global Attributes HTML.

Event Attributes:

Element <base> tidak mendukung Event Attributes apapun.

Browser Support :

Desktop

ChromeYa
SafariYa
Firefox1
OperaYa
IEYa
EdgeYa

Mobile

Android WebviewYa
Chrome AndroidYa
Edge MobileYa
Firefox Android4
Opera AndroidYa
iOs SafariYa
Samsung InternetYa

Default CSS :

Browser yang support dengan element <base>, biasanya mempunyai nilai default :
/* tidak ada */
X
Run
Klik tombol Run, untuk menampilkan hasil editing, atau menyegarkan editor.