- HTML： Hyper Text Marup Language 超文本标记语言
- 是一种标记语言（Marup Language），不是编程语言
- HTML用标签描述网页
<html><body><h1>我的第一个标题</h1><p>我的第一个段落。</p>
</body>
</html>
例子解释
- <html> 与 </html> 之间的文本描述网页
- <body> 与 </body> 之间的文本是可见的页面内容
- <h1> 与 </h1> 之间的文本被显示为标题
- <p> 与 </p> 之间的文本被显示为段落
1.HTML 链接是通过<a>标签来定义。eg：<a href="http://baidu.com">this is baidu</a>2.HTML 图像 <img/>eg:<img src=" pic.jpg" width="100" height="200"/>
3.HTML 标题
标题（Heading）是通过 <h1> - <h6> 等标签进行定义的。
<h1> 定义最大的标题。<h6> 定义最小的标题。
实例
<h1>This is a heading</h1> <h2>This is a heading</h2> <h3>This is a heading</h3>
<!-- 注释部分 -->
属性 值 描述 class classname 规定元素的类名（classname） id id 规定元素的唯一 id style style_definition 规定元素的行内样式（inline style） title text 规定元素的额外信息（可在工具提示中显示）
id属性规定HTML的唯一 IDid在HTML文档中必须是唯一的id属性可用作链接，通过js或css为带有指定ID的元素定义样式
eg1：通过js 利用id属性改变样式
<html><head><script type="text/javascript" >function change-header(){document.getElementById("FirstHeader").innerHTML="2 hi chunhcun";}</script></head><body><h1 id="FirstHeader">1 hello chunchun</h1><button onclick="change-header()">change header</button></body></html>
eg2:通过css改变样式
注：#代表id。.代表class
<html><head><style>#firstheader{color: yellow;width: auto;text-align: center;}</style></head><body><h1 id="firstheader"> hello 3</h1></body></html>
2.class属性
class属性规定元素的类名
class属性大多数时候用于指向样式表中的类。
注：class 属性不能在以下HTML元素中使用：base，head，meta，param，script，style，title。
类名不能以数字开头，只有ie支持这种写法。
eg：
<html> <head> <style type="text/css"> h1.intro {color:blue;} p.important {color:green;} </style> </head> <body> <h1class="intro">Header 1</h1> <p>A paragraph.</p> <pclass="important">Note that this is an important paragraph.</p> </body> </html>
3，style属性
提供了一种改变所有HTML元素样式的通用方法。
可以使用style属性直接改变元素样式，或使用css文件间接进行定义元素格式。
eg1：background-color：定义背景颜色
<html> <body style="background-color:yellow"> <h2 style="background-color:red">This is a heading</h2> <p style="background-color:green">This is a paragraph.</p> </body> </html>eg2：font-family、color 以及 font-size 字体系列，颜色，尺寸
<html> <body> <h1 style="font-family:verdana">A heading</h1> <p style="font-family:arial;color:red;font-size:20px;">A paragraph.</p> </body> </html>
eg3：text-align 属性规定了元素中文本的水平对齐方式：
<html> <body> <h1 style="text-align:center">This is a heading</h1> <p>The heading above is aligned to the center of this page.</p> </body> </html>
三，css
1.外部样式表
当样式需要被应用到很多页面时，使用外部样式表，改变一个文件，可改变一个站点。
<head><link rel="stylesheet" type="text/css" href="mystyle.css"></head>
2.内部样式表
当单个文件需要应用到个别元素时，使用内部样式表。可在head部分通过<style>标签定义内部样式表。
<head><style type="text/css"> body {background-color: red} p {margin-left: 20px} </style></head>
3.内联样式表
当特殊的元素需要应用个别元素时，可用内联样式表。直接在相关的标签中使用样式属性
<pstyle="color: red; margin-left: 20px"> This is a paragraph </p>
四.表格
表格由 <table> 标签来定义。
每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。
字母 td 指表格数据（table data），即数据单元格的内容。
数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。
1,表格的属性：border，空单元格，表头。
具体查阅http://www.w3school.com.cn/html/html_tables.asp
<table border="1"> <tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <tr><td> </td><td>row 2, cell 2</td> </tr> </table>
五，列表
1，无序列表
是一个项目的列表，此列项目列表使用粗体圆点来标记。
无序列表始于<ul>标签，每个列表项始于<li>.
<ul><li>Coffee</li><li>Milk</li></ul>浏览器显示如下：
- Coffee
- Milk
列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。
2，有序列表
有序列表也是一列项目，列表项目使用数字进行标记。
始于<ol>。每个列表项始于<li>.
<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>
浏览器显示如下：
- Coffee
- Milk
列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。
3，定义列表
自定义列表不仅仅是一列项目，而是项目及其注释的组合。
自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始。
<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd></dl>
浏览器显示如下：
Coffee
- Black hot drink
Milk
- White cold drink
定义列表的列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。
308
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
