HTML基本整理<1>
@[基本实例|html]
基本代码格式
<!DOCTYPE HTML>
<html>
<body>
<h1>html基本格式</h1>
</body>
<html>
HTML基本标签
<h1></h1><!--html标题-->
<p></p><!--html段落-->
<a href="http://www.baidu.com"></a><!--html链接-->
<img src="王皓.jpg" width="100" height="100" /><!--html图片-->
<br/><!--回车换行-->
HTML属性
属性一般以名称/值对
方式出现
常用属性列表
属性 | 描述 |
---|---|
class | 规定类名 |
id | 规定元素唯一id |
lang | 规定元素内容的语言 |
style | 规定行内css样式 |
HTML标题
HTML标题
标题通过<h1>-<h6>
定义
实例
<h1>h1标题</h1>
<h2>h2标题</h2>
<h3>h3标题</h3>
<h4>h4标题</h4>
<h5>h5标题</h5>
<h6>h6标题</h6>
HTML水平线
水平线用于分隔内容,用<hr/>
标签创建
HTML注释
注释通过<!--注释内容-->
标记创建
HTML段落
段落通过<p>段落内容</p>
标记
HTML样式
样式通过style
属性设定
HTML格式化
文本格式化常用标签
属性 | 描述 | 实例 |
---|---|---|
b | 加粗 | b |
big | 加大 | big |
em | 着重 | em |
i | 斜体 | i |
small | 减小 | small |
strong | 加重语气 | strong |
sub | 下标 | ma |
sup | 上标 | ma |
ins | 插入 | ins |
del | 删除 |
计算机输出标签
属性 | 描述 | 实例 |
---|---|---|
code | 计算机代码 | html |
kbd | 键盘码 | kbd |
var | 变量 | |
pre | 预格式 |
引用
属性 | 描述 |
---|---|
abrr | 缩写 |
acronym | 首字母缩写 |
blockquote | 长引用 |
q | 短引用 |
cite | 引用、引证 |
HTML样式
外部样式表
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
内部样式表
<html>
<style type="text/css">
body{background-color:red}
</html>
内联样式表
<p style="background-color:red;">
style
</p><!--style设置请看css教程-->
HTML链接
<a href="http://www.baidu.com">html链接</a>
<!--可以增加target属性定义打开方式-->
<!--可以增加name属性定义页内书签-->
HTML图像
<img src="王皓.jpg" alt="王皓" href="#"/>
HTML表格
<table>
<tr>
<th>Heading</th>
<th>Heading</th>
</tr>
<tr>
<td>row1,col1</td>
<td>row1,col2</td>
</tr>
<tr>
<td>row2,col1</td>
<td>row2,col2</td>
</tr>
</table>
<!--border定义边框属性-->
效果
Heading | Heading |
---|---|
row1,col1 | row1,col2 |
row2,col1 | row2,col2 |
HTML列表
无序列表
<ul>
<li>1</li>
<l1>2</li>
</ul>
- 1
- 2
有序列表
<ol>
<li>1</li>
<l1>2</li>
</ol>
- 1
- 2
HTML div
和span
HTML div
HTML<div>
元素是块级元素,它是可用于组合其他 HTML 元素的容器。
<div>
元素没有特定的含义。除此之外,由于它属于块级元素,浏览器会在其前后显示折行。
如果与 CSS 一同使用,<div>
元素可用于对大的内容块设置样式属性。
HTML span
HTML <span>
元素是内联元素,可用作文本的容器。
<span>
元素也没有特定的含义。
当与 CSS 一同使用时,` 元素可用于为部分文本设置样式属性。