CMRIT
24th September, 2017
Rutuja Surve
Abhiram
@MozillaIn
https://aframe.io/
<html>
<head> <meta charset="utf-8" /> <title>A tiny document</title> </head>
<body> <p>My dog ate all the guacamole.</p> </body> </html>
<!--paragrapah-->
<p>This is text within a paragraph.</p>
<!--nested tags-->
<p>I <strong>really</strong> mean that</p>
<!-- single elements -->
<img src="smileyface.jpg" />
<p id="myinput">
<p class="foo">
<img src="picture.gif" width="40" height="20" alt="I am a picture" />
<head>
<meta name="keywords" content="HTML, CSS, JavaScript"> <meta name="description" content="Intro to web dev"> <meta name="author" content="Alberto Romeu"> <meta http-equiv="refresh" content="30">
<title>Title of the document</title>
</head>
<body>
Write here the content of your web page
</body>
<h1>I'm a very big heading</h1>
<h2>I'm a quite big heading</h2>
<h3>I'm a big heading</h3>
<h4>I'm a heading</h4>
.
.
.
<p>
Here’s a paragraph.
</p>
<p>
And here’s a different one.
It’s as simple as that.
</p>
I’d like to write some text<br>and then have the next bit on the line below.
<p>Here’s a paragraph of text. What I want to happen is to make <span style="font-weight:bold;">some of the text bold</span></p>
<a href="http://www.prodevelop.es" target="blank">This is a link</a>
<img src="picture.jpg" width="104" height="142" />
<a href="http://www.prodevelop.es" target="blank">
<img src="picture.jpg" width="104" height="142"/>
</a>
Here’s some content…
<div>This is a div.</div>
<div>And this is another one. Works pretty much like a new paragraph for now.</div>
Here’s some more content…
<table border="1">
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
<ul> <li>Coffee</li> <li>Milk</li> </ul>
<ol> <li>Coffee</li> <li>Milk</li> </ol>
<!DOCTYPE html>
<html>
<body>
<div id="container" style="width:500px">
<div id="header" style="background-color:#FFA500;">
<h1 style="margin-bottom:0;">Main Title of Web Page</h1></div>
<div id="menu" style="background-color:#FFD700;height:200px;width:100px;float:left;">
<b>Menu</b><br>
HTML<br>
CSS<br>
JavaScript</div>
<div id="content" style="background-color:#EEEEEE;height:200px;width:400px;float:left;">
Content goes here</div>
<div id="footer" style="background-color:#FFA500;clear:both;text-align:center;">
I'm the footer</div>
</div>
</body>
</html>
<form> First name: <input type="text" name="firstname"><br> Last name: <input type="text" name="lastname"> </form>
<form name="input" action="html_form_action.php" method="get"> Username: <input type="text" name="user"> <input type="submit" value="Submit"> </form>
<iframe src="demo_iframe.htm" width="200" height="200"></iframe>
<head> <title><title>
<style type=”text/css”> CSS Content Goes Here </style>
</head> <body>
<head> <title><title>
<link rel=”stylesheet” type=”text/css” href=”style.css” />
</head> <body>
<p style=”color: #ff0000;”>Some red text</p>
body {
background: #eeeeee;
font-family: “Trebuchet MS”, Verdana, Arial, serif;
}
body {font-family: Verdana, serif;}
h1 {font-family: Georgia, sans-serif;}
p {font-family: Tahoma, serif;}
<p>this is a paragraph</p>
p {font-family: Tahoma, serif;}
<span class="greentext">I'm green</span>
.greentext {
font-size: small;
color: #008080;
}
<div id="container">
This is a div
</div>
#container {
width: 80%;
margin: auto;
padding: 20px;
background: #ffffff;
border: 1px solid #666;
}
<script type="text/javascript">
//JavaScript goes here
</script>
<script src="whatever.js" type="text/javascript"></script>
var element = document.getElementById("theID");
document.getElementByClass('a');
element.innerHTML = "Write the HTML";
element.style.color = "blue";
Abhiram | Mozilla Tech Speaker
Mail me: abhi12ravi@gmail.com
Telegram: @abhi12ravi
Rutuja | Mozilla Rep
Mail: rutuja.r.surve@gmail.com
Telegram: @rsurve
Feedback: MZL.LA/HOWWASIT