HTML5学习系列（2）：属性、表格、链接和列表、块

HTML基础标签

Head、body

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

1. 标题

<h1>.....<h6> 依次减小标题尺寸

2. 段落

<p>文字1</p>文字2 定义文字1和2分段

3. 链接

<a href=“网址”>文字</a> 定义文字链接

4. 图像

<img src =“指定图片具体位置”> 定义图像

5. 换行

<br/>

HTML属性

1. 标签有属性

2. 属性以键/值对的形式出现

网址属性：href=“www.baidu.com”

3. 常用标签属性

<h1>:align 对齐方式

<body>:bgcolor背景颜色

<a>:target规定在何处打开链接

4. 通用属性

class：类名

id：ID

style：样式

title：额外信息

举例：

<html>
    <head  lang=“en”> 
    <meta charset=“utf-8”>
    <title></title>
    <style></style>
</head>
    <body bgcolor=”#8b0000”>
        <a href=”hrefht.html” target =“-blank”>打开本地</a> 
        <h1 align=”center”>标题h1</h1>
        <h2 id=”my”>标题h2</h2>

    </body>
</html>

HTML表格

<html>
<head> 
    <title></title>
</head>
<body>
    <b>欢迎</b>
    <br/>                        /*换行*/
    <big>欢迎</big>               /*更大*/
    <br/>  
    <em>欢迎</em>               /*着重*/
    <br/>  
    <i>欢迎</i>                   /*倾斜*/
    ...
</body>
</html>

HTML链接和列表

<a href=“网址”>文字</a> 定义文字链接

　　　　　　　　　　　<img src=”.png” width=”200px” height=’’200px” alt =“html5logo”>图片不显示时候的文字显示

　　　　　　　　</a> 定义图片链接

将其插入到body内查看效果。

表格：

<html>
　　<head  lang=“en”> 
　　<meta charset=“utf-8”>
　　<title></title>
　　<style></style>
</head>
　　<body>
　　　　<table border=”10” cellpadding=“10”bgcolor=”#8b000”,background=”.png”>
　　　　　　<captian>这是一个表格</captian>
　　　　　　<tr>
　　　　　　　　<td>表格1<td>
　　　　　　　　<td>表格2<td>
　　　　　　　　<td>表格3<td>
　　　　　　<tr>
　　　　</table>
　　</body>
</html>

列表：

<html>
　<head  lang=“en”> 
　　<meta charset=“utf-8”>
　　<title></title>
　　<style></style>
　</head>
　　<body>
　　　　<ul type=”disc/square/circle“>
　　　　　　<li>有序表格1<li>
　　　　　　<li>有序表格2<li>
　　　　　　<li>有序表格3<li>
　　　　　<ul><ol type=a/i；start=”10“>
          <li>无序表格1<li>
          <li>无序表格2<li>
          <li>无序表格3<li>
      <ol><dl type=”circle“>
          <dt>自定义表格1<dt>
          <dt>自定义表格2<dt>
          <dt>自定义表格3<dt>
      <dl>
　　</body>
</html>

HTML块

div布局：

<html>
　　<head  lang=“en”> 
　　<meta charset=“utf-8”>
　　<title>div布局</title>
　　<style type=”type=”text/css“></style>
</head>
　　<body>
　　　　<b></b>加重标签
　　　　<div id=”container”>文件
　　　　　　<div id=”heading”>头部</div>
　　　　　　<div id=”container”>CSS样式文件1</div>
　　　　　　<div id=”container”>CSS样式文件2</div>
　　　　　　<div id=”container”>CSS样式文件3</div>
　　　　</div>
　　</body>
</html>

来源：https://www.cnblogs.com/q0227/p/11922106.html

标签

html5

html表格

html文件