Ubah form kepada lebih menarik

Ubah form kepada lebih menarik

Cara mudah untuk ubah borang ini kepadatema di bawah yagn lebih menarik.

Kod borang asal:

<div class="container">
  <h2>Upload Demo</h2>
  <div class="panel panel-default">
    <div class="panel-heading">Maklumat</div>
    <div class="panel-body">

		<form method="post" action="" enctype = "multipart/form-data">				
			<div class="form-group">
			  <label>Nama *</label>
				<input name="nama" class="form-control" type="text" placeholder="Masukkan nama" required>
			</div>

			<div class="form-group">
			  <label>Photo format (jpg, png, gif)*</label>
				<input name="gambar" type="file" required accept=".jpg,.png,.gif">
			</div>
			
			<hr>

			<input name="act" type="hidden" value="add">
			<button class="btn btn-primary" type="submit">Submit</button>
		</form>
	
	</div>
  </div>
</div>

Hanya tambahkan di bahagian head sahaja.

 

<head>
  <title>Upload Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
</head>

 

Leave a Reply

comment-avatar

*

This site uses Akismet to reduce spam. Learn how your comment data is processed.