61,115
社区成员
发帖
与我相关
我的任务
分享HTML基础
Html
什么是 HTML？
HTML 是用来描述网页的一种语言。
HTML 指的是超文本标记语言 (Hyper Text Markup Language) HTML 不是一种编程语言，而是一种标记语言 (markup language)
Html包含静态html和动态html
学习推荐网站：
http://www.w3school.com.cn/html/html_headings.asp
HTML 标签
· HTML 标记标签通常被称为 HTML 标签 (HTML tag)。
· HTML 标签是由尖括号包围的关键词，比如 <html>
· HTML 标签通常是成对！出现的，比如 <b> 和 </b>
· 标签对中的第一个标签是开始标签，第二个标签是结束标签
· 开始和结束标签也被称为开放标签和闭合标签
案例解析
· <html> 与 </html> 之间的文本描述网页
· <head>与</head>之间标签用于定义文档的头部，它是所有头部元素的容器。
· <body> 与 </body> 之间的文本是可见的页面内容
· <h1> 与 </h1> 之间的文本被显示为标题
· <p> 与 </p> 之间的文本被显示为段落
HTML 编辑器
1. Adobe Dreamweaver
2. notepad++
3. 记事本
URL地址构成
组成：http://localhost:4431/myfirst.html
网络协议：http:// 和 https://（http+ssl）
服务器地址
域名
本地：localhost：80（默认情况，端口不需要输入）
端口号：localhost：4431（端口本修改，一定要跟端口号）
百度：www.baidu.com
IP地址
本地：127.0.0.1
百度：14.215.177.39
项目路径
http://localhost:4431/ranzhi/www
访问请求方式
get
http://localhost:4431/ranzhi/www/login?username=admin&password=123456
post
基本的 HTML 标签
HTML 标题
HTML 标题（Heading）是通过 <h1> - <h6> 等标签进行定义的。
head定义和用法
<head> 标签用于定义文档的头部，它是所有头部元素的容器。<head> 中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等等。
HTML 段落
HTML 段落是通过 <p> 标签进行定义的。
HTML 链接
· HTML 链接是通过 <a> 标签进行定义的。
· <a> 标签定义超链接，用于从一张页面链接到另一张页面。
· <a> 元素最重要的属性是 href 属性，它指示链接的目标。
HTML 图像
HTML 图像是通过 <img> 标签进行定义的。
HTML 注释
可以将注释插入 HTML 代码中，这样可以提高其可读性，使代码更易被人理解。浏览器会忽略注释，也不会显示它们。 注释是这样写的：
HTML 换行
如果您希望在不产生一个新段落的情况下进行换行（新行），请使用 <br /> 标签：
HTML 横线
<hr>
HTML 表单
<form>表单</form>
<table>表格</table>
<tr>第几行</tr>
<td>第几列</td>
<input type="text" name="username" /> 文本输入
<input type="radio" 2name="sex" checked/>男 单选框----checked默认选择
<input type="checkbox" name="xihao" value="read" />读书
<input type="checkbox" name="xihao" value="shopping" />购物
<input type="checkbox" name="xihao" value="read" /> 复选框
<select name="xueli"> 下拉列表选择
<option value="0" selected>大学</option>
<option value="1" selected>小学</option>
<option value="2" selected>初中</option>
</select>
<input type="file" name='files' /> 上传
<textarea rows="10" cols="30">文本区域</textarea>
<button id="submit" type="submit">按钮</button>
<button id="submit" type="submit">注册</button>
<button id="reset" type="reset">重置</button>
HTML Div
<div> 可定义文档中的分区或节（division/section）。
<div> 标签可以把文档分割为独立的、不同的部分。它可以用作严格的组织工具，并且不使用任何格式与其关联。
如果用 id 或 class 来标记 <div>，那么该标签的作用会变得更加有效。
更多标签 请见：http://www.w3school.com.cn/tags/index.asp
常见属性
name属性
name 属性用于指定标签元素的名称。
<a> 标签内必须提供 href 或 name 属性。
id属性
1. id 属性规定 HTML 元素的唯一的 id。
2. id 在 HTML 文档中必须是唯一的。
3. id 属性可通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
注意
id 或 name 属性的值可以是引号引起来的任何字符串。
字符串必须是唯一的标记，不能在同一文档中的其他 name 或 id 属性中重复使用，但是可以在不同的文档中再次使用。
style 属性
样式是 HTML 4 引入的，它是一种新的首选的改变 HTML 元素样式的方式。
通过 HTML 样式，能够通过使用 style 属性直接将样式添加到 HTML 元素，或者间接地在独立的样式表中（CSS 文件）进行定义。
常见样式实例
HTML 样式实例 - 背景颜色
background-color 属性为元素定义了背景颜色：
HTML 样式实例 - 字体、颜色和尺寸
font-family、color 以及 font-size 属性分别定义元素中文本的字体系列、颜色和字体尺寸：
HTML 样式实例 - 文本对齐
text-align 属性规定了元素中文本的水平对齐方式：
更多HTML属性请见：http://www.w3school.com.cn/tags/html_ref_standardattributes.asp
HTML CSS(Cascading Style Sheets)
CSS产生缘由
HTML 标签原本被设计为用于定义文档内容。通过使用 <h1>、<p>、<table> 这样的标签，HTML 的初衷是表达“这是标题”、“这是段落”、“这是表格”之类的信息。同时文档布局由浏览器来完成，而不使用任何的格式化标签。 由于两种主要的浏览器（Netscape 和 Internet Explorer）不断地将新的 HTML 标签和属性（比如字体标签和颜色属性）添加到 HTML 规范中，创建文档内容清晰地独立于文档表现层的站点变得越来越困难。
CSS作用
样式通常保存在外部的 .css 文件中。通过仅仅编辑一个简单的 CSS 文档，外部样式表使你有能力同时改变站点中所有页面的布局和外观。
CSS语法
CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明。
· 选择器通常是您需要改变样式的 HTML 元素。
· 每条声明由一个属性和一个值组成。
· 属性（property）是您希望设置的样式属性（style attribute）。每个属性有一个值。属性和值被冒号分开。
例子：将 h1 元素内的文字颜色定义为红色，同时将字体大小设置为 14 像素。
Css外部样式引用
更多css内容请参考：http://www.w3school.com.cn/css/index.asp
本文档参考来源：http://www.w3school.com.cn/index.html
什么是 HTML？
HTML 是用来描述网页的一种语言。
HTML 指的是超文本标记语言 (Hyper Text Markup Language) HTML 不是一种编程语言，而是一种标记语言 (markup language)
Html包含静态html和动态html
学习推荐网站：
http://www.w3school.com.cn/html/html_headings.asp
HTML 标签
· HTML 标记标签通常被称为 HTML 标签 (HTML tag)。
· HTML 标签是由尖括号包围的关键词，比如 <html>
· HTML 标签通常是成对！出现的，比如 <b> 和 </b>
· 标签对中的第一个标签是开始标签，第二个标签是结束标签
· 开始和结束标签也被称为开放标签和闭合标签
案例解析
· <html> 与 </html> 之间的文本描述网页
· <head>与</head>之间标签用于定义文档的头部，它是所有头部元素的容器。
· <body> 与 </body> 之间的文本是可见的页面内容
· <h1> 与 </h1> 之间的文本被显示为标题
· <p> 与 </p> 之间的文本被显示为段落
HTML 编辑器
1. Adobe Dreamweaver
2. notepad++
3. 记事本
URL地址构成
组成：http://localhost:4431/myfirst.html
网络协议：http:// 和 https://（http+ssl）
服务器地址
域名
本地：localhost：80（默认情况，端口不需要输入）
端口号：localhost：4431（端口本修改，一定要跟端口号）
百度：www.baidu.com
IP地址
本地：127.0.0.1
百度：14.215.177.39
项目路径
http://localhost:4431/ranzhi/www
访问请求方式
get
http://localhost:4431/ranzhi/www/login?username=admin&password=123456
post
基本的 HTML 标签
HTML 标题
HTML 标题（Heading）是通过 <h1> - <h6> 等标签进行定义的。
head定义和用法
<head> 标签用于定义文档的头部，它是所有头部元素的容器。<head> 中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等等。
HTML 段落
HTML 段落是通过 <p> 标签进行定义的。
HTML 链接
· HTML 链接是通过 <a> 标签进行定义的。
· <a> 标签定义超链接，用于从一张页面链接到另一张页面。
· <a> 元素最重要的属性是 href 属性，它指示链接的目标。
HTML 图像
HTML 图像是通过 <img> 标签进行定义的。
HTML 注释
可以将注释插入 HTML 代码中，这样可以提高其可读性，使代码更易被人理解。浏览器会忽略注释，也不会显示它们。 注释是这样写的：
HTML 换行
如果您希望在不产生一个新段落的情况下进行换行（新行），请使用 <br /> 标签：
HTML 横线
<hr>
HTML 表单
<form>表单</form>
<table>表格</table>
<tr>第几行</tr>
<td>第几列</td>
<input type="text" name="username" /> 文本输入
<input type="radio" 2name="sex" checked/>男 单选框----checked默认选择
<input type="checkbox" name="xihao" value="read" />读书
<input type="checkbox" name="xihao" value="shopping" />购物
<input type="checkbox" name="xihao" value="read" /> 复选框
<select name="xueli"> 下拉列表选择
<option value="0" selected>大学</option>
<option value="1" selected>小学</option>
<option value="2" selected>初中</option>
</select>
<input type="file" name='files' /> 上传
<textarea rows="10" cols="30">文本区域</textarea>
<button id="submit" type="submit">按钮</button>
<button id="submit" type="submit">注册</button>
<button id="reset" type="reset">重置</button>
HTML Div
<div> 可定义文档中的分区或节（division/section）。
<div> 标签可以把文档分割为独立的、不同的部分。它可以用作严格的组织工具，并且不使用任何格式与其关联。
如果用 id 或 class 来标记 <div>，那么该标签的作用会变得更加有效。
更多标签 请见：http://www.w3school.com.cn/tags/index.asp
常见属性
name属性
name 属性用于指定标签元素的名称。
<a> 标签内必须提供 href 或 name 属性。
id属性
1. id 属性规定 HTML 元素的唯一的 id。
2. id 在 HTML 文档中必须是唯一的。
3. id 属性可通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
注意
id 或 name 属性的值可以是引号引起来的任何字符串。
字符串必须是唯一的标记，不能在同一文档中的其他 name 或 id 属性中重复使用，但是可以在不同的文档中再次使用。
style 属性
样式是 HTML 4 引入的，它是一种新的首选的改变 HTML 元素样式的方式。
通过 HTML 样式，能够通过使用 style 属性直接将样式添加到 HTML 元素，或者间接地在独立的样式表中（CSS 文件）进行定义。
常见样式实例
HTML 样式实例 - 背景颜色
background-color 属性为元素定义了背景颜色：
HTML 样式实例 - 字体、颜色和尺寸
font-family、color 以及 font-size 属性分别定义元素中文本的字体系列、颜色和字体尺寸：
HTML 样式实例 - 文本对齐
text-align 属性规定了元素中文本的水平对齐方式：
更多HTML属性请见：http://www.w3school.com.cn/tags/html_ref_standardattributes.asp
HTML CSS(Cascading Style Sheets)
CSS产生缘由
HTML 标签原本被设计为用于定义文档内容。通过使用 <h1>、<p>、<table> 这样的标签，HTML 的初衷是表达“这是标题”、“这是段落”、“这是表格”之类的信息。同时文档布局由浏览器来完成，而不使用任何的格式化标签。 由于两种主要的浏览器（Netscape 和 Internet Explorer）不断地将新的 HTML 标签和属性（比如字体标签和颜色属性）添加到 HTML 规范中，创建文档内容清晰地独立于文档表现层的站点变得越来越困难。
CSS作用
样式通常保存在外部的 .css 文件中。通过仅仅编辑一个简单的 CSS 文档，外部样式表使你有能力同时改变站点中所有页面的布局和外观。
CSS语法
CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明。
· 选择器通常是您需要改变样式的 HTML 元素。
· 每条声明由一个属性和一个值组成。
· 属性（property）是您希望设置的样式属性（style attribute）。每个属性有一个值。属性和值被冒号分开。
例子：将 h1 元素内的文字颜色定义为红色，同时将字体大小设置为 14 像素。
Css外部样式引用
更多css内容请参考：http://www.w3school.com.cn/css/index.asp
本文档参考来源：http://www.w3school.com.cn/index.html
...全文
请发表友善的回复…
发表回复
