您的位置：首页 > Web前端 > HTML

Html

2016-06-02 13:20 267 查看
[TOC]

html基本点


HTML 标签对大小写不敏感，推荐使用小写

<h1>This is a heading</h1>
标题

<p>This is another paragraph.</p>
段落

<a href="http://www.w3school.com.cn">This is a link</a>
链接定义

<img src="w3school.jpg" width="104" height="142" />
图像

<br/>
换行，建议封闭

<hr/>
标签在 HTML 页面中创建水平线

<!-- This is a comment -->
注释

<img src=""></img>
定义图像

<img src="boat.gif" alt="Big Boat">
alt为图像定义可替换文本（备用）

 
空格



标签 描述

<style type="text/css"></style>
定义样式定义。

<link rel="stylesheet" type="text/css" href="">
定义资源引用。

<div></div>
定义文档中的节或区域（块级）。



新的窗口显示

<a href="http://www.abc.com" target="_blank">hello world!</a>



表格table

<table></table>表,<tr></tr>行,<td></td>列,<th></th>表头,


<table border="1"> //border="1"边框属性
<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>。
<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>
有序列表始于 <ol> 标签。每个列表项始于 <li> 标签。
<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>
自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始。

name 属性


name属性定义锚（anchor）的名称，界面透明， id 属性来替代 name 性，命名锚同样有效。


<a name="tips">some tips</a>
使用
<a href="#tips">有用的提示</a>
<a href="http://www.w3school.com.cn/html/html_links.asp#tips">有用的提示</a>
*在上面的代码中，我们将 # 符号和锚名称添加到 URL 的末端*

div和span

<div></div>
定义文档中的分区或节（division/section）。

<span></span>
定义 span，用来组合文档中的行内元素。

表单

表单是一个包含表单元素的区域。
表单元素是允许用户在表单中（比如：文本域、下拉列表、单选框、复选框等等）输入信息的元素。
表单使用表单标签（<form>）定义。
多数情况下被用到的表单标签是输入标签（<input>）。输入类型是由类型属性（type）定义的。
<form>
First name:
<input type="text" name="firstname" />
<br />
Last name:
<input type="text" name="lastname" />
</form>

**表单的动作属性（Action）和确认按钮**
当用户单击确认按钮时，表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。
<form name="input" action="html_form_action.asp" method="get">
Username:
<input type="text" name="user" />
<input type="submit" value="Submit" />
</form>


如何使用样式


外部样式


<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>


内部样式


<head>
<style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style>
</head>


内联样式


<p style="color: red; margin-left: 20px">
This is a paragraph
</p>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航