Resepi Puding Roti

Bahan Bahan

Bahagian A

  • Roti 8 keping
  • Sekotak kismis

Bahagian B

  • 3 cawan susu segar
  • 2 biji telur
  • 4 sudu gula
  • 2 sudu mentega

Bahagian C (sos kastad)

  • 1 tin susu cair
  • 4 sudu gula.
  • 3/4 cawan air
  • 2 sudu tepung kastad.

Cara cara memasak

1. Roti dikoyak-koyak dan dimasukkan ke dalam loyang kemudian ketepikan.

2.Masukkan kesemua bahan bahagian B ke dalam periuk dan kacau hingga semua sebati, tidak perlu sehingga mendidih. Gunakan api kecil.

Apabila bahan bahan sudah sebati, curahkan keatas roti tadi dan taburkan kismis diatasnya.

 

Puding Roti

Image via Facebook

 

3. Kemudian, masukkan ke dalam ketuhar dengan suhu 200 darjah celcius selama 45 minit.

Oven perlu dipanaskan terlebih dahulu dan didalam dulang ketuhar, letakkan segelas air kemudian barulah letakkan loyang agar suhu didalam oven sekata.

 

Puding Roti

Imej via Facebook

4. Sementara puding roti masak, kita buat sos kastad pula. Masukkan kesemua bahan kedalam periuk, masak dengan api yang kecil. Apabila semua bahan sudah sebati serta mendidih dan menjadi agak likat, tutup api.

Sendukkan puding roti yang telah masak kedalam pinggan dan curahkan sos kastad diatas puding roti tadi.

Selamat mencuba!

Ihsan dr google.

Posted in Uncategorized | Leave a comment

JavaScript Form Validation

<!DOCTYPE html>
<html>
<head>
<script>
function validateForm() {
var x = document.forms[“myForm”][“fname”].value;
if (x == “”) {
alert(“Name must be filled out”);
return false;
}
}
</script>
</head>
<body>

<form name=”myForm” action=”/action_page.php” onsubmit=”return validateForm()” method=”post”>
Name: <input type=”text” name=”fname”>
<input type=”submit” value=”Submit”>
</form>

</body>
</html>

 

Posted in Uncategorized | Leave a comment

JavaScript Output

Using innerHTML

To access an HTML element, JavaScript can use the document.getElementById(id) method.

The id attribute defines the HTML element. The innerHTML property defines the HTML content:

<!DOCTYPE html>
<html>
<body>

<h2>My First Web Page</h2>
<p>My First Paragraph.</p>

<p id=”demo”></p>

<script>
document.getElementById(“demo”).innerHTML = 5 + 6;
</script>

</body>
</html>

Using document.write()

For testing purposes, it is convenient to use document.write():

<!DOCTYPE html>
<html>
<body>

<h2>My First Web Page</h2>
<p>My first paragraph.</p>

<p>Never call document.write after the document has finished loading.
It will overwrite the whole document.</p>

<script>
document.write(5 + 6);
</script>

</body>
</html>

Using window.alert()

You can use an alert box to display data:

<!DOCTYPE html>
<html>
<body>

<h2>My First Web Page</h2>
<p>My first paragraph.</p>

<script>
window.alert(5 + 6);
</script>

</body>
</html>

Using console.log()

For debugging purposes, you can use the console.log() method to display data.

<!DOCTYPE html>
<html>
<body>

<h2>Activate debugging with F12</h2>

<p>Select “Console” in the debugger menu. Then click Run again.</p>

<script>
console.log(5 + 6);
</script>

</body>
</html>

 

Posted in Uncategorized | Leave a comment

HTML Responsive Web Design

What is Responsive Web Design?

Responsive Web Design is about using HTML and CSS to automatically resize, hide, shrink, or enlarge, a website, to make it look good on all devices (desktops, tablets, and phones).

Posted in Uncategorized | Leave a comment

HTML Styles

HTML Background Color

<!DOCTYPE html>
<html>
<body style=”background-color:powderblue;”>

<h1>This is a heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

HTML Text Color

<!DOCTYPE html>
<html>
<body>

<h1 style=”color:blue;”>This is a heading</h1>
<p style=”color:red;”>This is a paragraph.</p>

</body>
</html>

HTML Fonts

<!DOCTYPE html>
<html>
<body>

<h1 style=”font-family:verdana;”>This is a heading</h1>
<p style=”font-family:courier;”>This is a paragraph.</p>

</body>
</html>

HTML Text Size

<!DOCTYPE html>
<html>
<body>

<h1 style=”font-size:300%;”>This is a heading</h1>
<p style=”font-size:160%;”>This is a paragraph.</p>

</body>
</html>

HTML Text Alignment

<!DOCTYPE html>
<html>
<body>

<h1 style=”text-align:center;”>Centered Heading</h1>
<p style=”text-align:center;”>Centered paragraph.</p>

</body>
</html>

Posted in Uncategorized | Leave a comment

Hello world!

Welcome to People@UTM. This is your first post. Edit or delete it, then start blogging!

Posted in Uncategorized | Leave a comment