您的位置:首页 > Web前端 > JavaScript

javascript学习之HTML

2015-01-14 17:48 190 查看
<html>
<head>
//7. div 实现对网页的布局
<style type"text/css">
div#container{width:500px}
div#header{background-color:99bbbb;}
div#meanu{background:200px;width:150px;float:left;}
div#content{background-color:#EEEEEE;height:200px;width:350px;float:left;}
div#footer {background-color:#99bbbb;clear:both;text-align:center;}
h1 {margin-bottom:0;}
h2 {margin-bottom:0;font-size:18px;}
ul {margin:0;}
li {list-style:none;}
</style>

</body>
</html>
</head>
<body>

<h1> this is a titile</h1>

<p>this is a paragraph</p>
<a href="http://baidu.com">this is a link</a>
<img src="**.jpg" width="1024" height="768"/>  
// 1.对字体的编辑
<b>this text is bold</b>// 粗体
<big>this text is big</big>// big字体
<em>this text is emphasized</em>// 强调
<strong>this is strong</strong> //strong 字体
<small>this text is small</small>//小号
this text contains<sub>subscript</sub>//字体上标
this text contains<sup>superscript</sup>//字体下标
// 2.写计算机的代码
<p>pre很是适合计算机的代码:</p>
<pre> // 使用pre就会按照计算机代码的格式输出
for (i = 0; i < 10; i++)
sum = sum++;
printf("%d",sum);
</pre>
// 3.在HTML中写地址的方法
<address>
Written by <a href="zhao@example.com">zhao</a>.<br>
Visit us at:<br>
Example.com<br>
Box 123,Disnedyland<br>
China
</address>
// 4.在一些浏览器中,当吧鼠标移动到缩略词语上时,title可以用来表达完整的内容
<abbr title="etcetera">stc.</abbr>
<acronym title="world wide web">WWW</acronym>
// 使用abbr和acronym的效果是一样的。
//5.将一行内容从用往做输出
<bdo dir="rtl">here is some hebrew text</bdo>
//6.显示删除文本和下划线的文本
<p>一打有<del>二十</del><ins>十二</ins>个。</p>//二十文本有中间被删的横线,十二下面是下划线
// 7.div实现对网页的布局
<div id="container">

<div id="header">
<h1>Main Title of Web Page</h1>
</div>

<div id="menu">
<h2>Menu</h2>
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
</div>
<div id="content">Content goes here</div>

<div id="footer">Copyright zhao.com.cn</div>

</div>
//使用table实现对网页的布局
<table width="500" border="0">
<tr>
<td colspan="2" style="background-color:#99bbbb;">
<h1>Main Title of Web Page</h1>
</td>
</tr>

<tr valign="top">
<td style="background-color:#ffff99;width:100px;text-align:top;">
<b>Menu</b><br />
HTML<br />
CSS<br />
JavaScript
</td>
<td style="background-color:#EEEEEE;height:200px;width:400px;text-align:top;">
Content goes here</td>
</tr>

<tr>
<td colspan="2" style="background-color:#99bbbb;text-align:center;">
Copyright W3School.com.cn</td>
</tr>
</table>
// 9.表单
<form>
Name:
<input type="text" name="name"/>
<br/>
Password:
<input type="text" name="password"/>
<input type="radio" name="sex" value="male" />male
<br/>
<input type="radio" name="sex" vale="female"/>female
</form>
//10框架
<frameset rows="25%,50%,25%"> // 水平框架rows垂直框架 cols
<frame src="">
<frame src="">
<frame src="">
</frameset>
注:1.html对大小写不敏感,许多网站都使用大写的HTML标签。
 2.<p>定义段落,<br/>插入单个换行
 

                                            
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息