HTML基本整理1

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 删除 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列表 ###无序列表 ```htmlbars
  • 1
    • 2
```
  • 1
  • 2
###有序列表 ```htmlbars
  1. 1
    2. 2
```
  1. 1
  2. 2
##HTML `div`和`span` ###HTML div HTML`
` 元素是块级元素，它是可用于组合其他 HTML 元素的容器。

<div> 元素没有特定的含义。除此之外，由于它属于块级元素，浏览器会在其前后显示折行。

如果与 CSS 一同使用，<div> 元素可用于对大的内容块设置样式属性。

HTML span

HTML <span> 元素是内联元素，可用作文本的容器。

<span> 元素也没有特定的含义。

当与 CSS 一同使用时，` 元素可用于为部分文本设置样式属性。

posted @ 2018-01-07 21:16  ustc_rjgc2017  阅读(149)  评论(0)  编辑  收藏  举报