html基础

时间:2014-04-29 11:21:46   收藏:0   阅读:581
mamicode.com,码迷
<html>
<body>


<h1>My first Heading </h1>
<p>My first paragraph.</p>

</body>
</html>
mamicode.com,码迷

 

第二个例子:

mamicode.com,码迷
<html>
<body>


<h1>My first Heading </h1>
<h2>My second Heading </h2>
<!--注解标题-->


<p>My first paragraph.</p>
<p>My second paragraph.</p>

<a href="http://www.baidu.com">This is a link</a>
<!--超链接-->

<img src = "u273314.jpg" width = "100" height = "142"/>
<!--插入图片-->

</body>
</html>
mamicode.com,码迷

 

对第二个例子的补充:

mamicode.com,码迷
<a href="http://www.example.com/">This is a Link</a>  
<a href="http://www.example.com/"><img src="u273324.jpg" alt="描述图像的语言,如果图像不显示,一般显示这里"></a>  
<a href="mailto:webmaster@example.com">Send e-mail</a>A named anchor: <!-- 发送邮件的链接 -->
<a name="tips">Useful Tips Section</a>
<a href="#tips">Jump to the Useful Tips Section</a>  <!-- 页面内部里面的超链接 -->
mamicode.com,码迷

 

格式:

mamicode.com,码迷
<p>This is a paragraph</p>  
<br> (line break 换行)
<hr> (horizontal rule 显示一条实线 换行)
<pre>
    pre之间的文字都是按照html上面怎么写就怎么显示的,
    123
        123
            123
</pre>
       pre外的文字都是按照html上面怎么写,html是不是管格式的,
    123
        123
            123
mamicode.com,码迷

 

 

表格:

表格由 <table> 标签来定义。每个表格均有若干行(由 <tr> 标签定义),每行被分割为若干单元格(由 <td> 标签定义)。字母 td 指表格数据(table data),即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。

mamicode.com,码迷
<table>
<tr>
<td>123412,123431,123 </td>
<td>123,123,123</td>
</tr>
<tr>
<td>123412,123431,123 </td>
<td>123,123,123</td>
</tr>
</table>
mamicode.com,码迷

 

列表:

1)无序列表:

无序列表是一个项目的列表,此列项目使用粗体圆点(典型的小黑圆圈)进行标记。

无序列表始于 <ul> 标签。每个列表项始于 <li>。

<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>

浏览器显示如下:

2)有序列表:

同样,有序列表也是一列项目,列表项目使用数字进行标记。

有序列表始于 <ol> 标签。每个列表项始于 <li> 标签。

<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>

浏览器显示如下:

  1. Coffee
  2. Milk

3)自定义列表:

自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始。

<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>

 

内联元素与块元素:

内联元素 如<b>, <td>, <a>, <img> 同常是跟在上一个元素的后边

而块元素 如:<h1>, <p>, <ul>, <table> 一般是另起一行显示元素

 

HTML表单输入:  (http://www.w3school.com.cn/html/html_forms.asp)

文字输入:

mamicode.com,码迷
<form>
First name: 
<input type="text" name="firstname" />
<br />
Last name: 
<input type="text" name="lastname" />
</form>
mamicode.com,码迷

单选按钮:

mamicode.com,码迷
<form>
<input type="radio" name="sex" value="male" /> Male
<br />
<input type="radio" name="sex" value="female" /> Female
</form>
mamicode.com,码迷

   等等

 

html的框架:

比如分成垂直的三部分:

<frameset cols = "25%,25%,50%">
    <frame src = "http://www.baidu.com/">
    <frame src = "https://www.google.com.hk/">
    <frame src = "http://www.163.com/">
</frameset>

 

 

 

html基础,码迷,mamicode.com

评论(0
© 2014 mamicode.com 版权所有 京ICP备13008772号-2  联系我们:gaon5@hotmail.com
迷上了代码!