本帖最后由 小鲁哥哥 于 2017-1-16 16:40 编辑
【济南中心】PHP课程同步笔记day01：HTML介绍
html简介 HyperText Markup Language 超文本标记语言 超文本 能够表达更丰富的内容（相对于普通文本） 标记：标识符号，就是html中的标签 语言 不是编程语言，就是html标签的描述 浏览器来翻译html代码 网页扩展名 .html .htm
HTML文档结构 HTML框架基本构架 <html> <head> <title></title> </head> <body> </body> </html> 解释： 带<>的都叫标签 html: 指明当前的文档的类型，是一个网页 head是网页头部 包括网页的相关信息，基本设置，其中title网站的标题就在里面。 body:在浏览器的看到的内容。
html标签分类 双标签 <font>HTML</font>,有开始标签和结束标签（标记） 单标签 <br />
标签书写规范 所有的标签都在< >中 所有的标签都有开始和结束，即使是单标记也要结束 <br /> 强制换行 <img /> 图片标记 所有的标签和属性及值小写 标签和属性，属性与属性之间有空格 属性值必须有加引号（单引号或双引号都可以） 属性必须有值 属性可写可不写 标签与标签之间正确嵌套(标签不可交叉嵌套)
标签格式 <开始标签 属性1＝”值1” 属性2＝”值2” 属性n＝”值n”>控制的内容</开始标签>(双标签格式) <开始标签 属性1＝”值1” 属性2＝”值2” 属性n＝”值n” 空格/>(单标签格式) <开始标签 空格/>(单标签格式)
html注释 <!--注释内容--> 注释的内容在html页面中是无法看到的，但是可以在页面源代码中发现 [HTML] 纯文本查看 复制代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">[/align][align=left]<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
</head>
<body>
HTML注释
<!--这段文字是看不见的-->
</body>
</html> 文本的修饰 属性： Color(颜色):red,blue,green,yellow,gray,pink等 Size(大小):值(1-7),默认值：3 字体最大尺寸为7，若比7大，则默认为7。字体默认尺寸为3，当出现对尺寸的加减时，就是对3进行加减 [HTML] 纯文本查看 复制代码 <html>[/align] <head>
<title> new document </title>
</head>
<body>
<font>我的第一个网页</font><br />
<font color="green">我的第一个网页</font><br />
<font color="green" size="7">我的第一个网页</font><br />
<font color="green" size="70">我的第一个网页</font><br />
<font color="green" size="+1">我的第一个网页</font><br />
<font color="green" size="4">我的第一个网页</font><br />
<font color="green" size="-1">我的第一个网页</font><br />
<font color="green" size="2">我的第一个网页</font><br />
</body>
</html>HTML文本修饰标记 <big>相对默认文字大一些 <small>对默认文字小一些 <b>加粗 <strong>加强语气 <i>斜体 <em>斜体 <u>下划线 <s> 删除线 <ins><del> <sup> <sub>
superscript 上标 subscript 下标
HTML排版标记 p 段落 自动在段前段后添加一个空白行 属性：align:值：left(左对齐,默认) center（居中对齐） right（右对齐） br 强行换行<br /> hr 单标记 <hr /> 属性：width 宽度：值:默认是像素，也可是百分比 align:对齐方式：left center right ，默认 center color :颜色 noshade 阴影设置 [HTML] 纯文本查看 复制代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">[/align]<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
</head>
<body>
<hr width="50%" color="blue" size="10" noshade="noshade">
<hr width="50%" size="3" >
<hr width="50%" size="3" noshade="noshade">
</body>
</html> h1-h6 <h1> - <h6> 标签可定义标题。<h1> 定义最大的标题。<h6> 定义最小的标题。 [HTML] 纯文本查看 复制代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">[/align]<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
</head>
<body>
<h1>标题1</h1>
<h2>标题2</h2>
<h3>标题3</h3>
<h4>标题4</h4>
<h5>标题5</h5>
<h6>标题6</h6>
</body>
</html> HTML字符实体 在 HTML 中不能使用小于号（<）和大于号（>），这是因为浏览器会误认为它们是标签。
Pre:可定义预格式化的文本 被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体.
<div>和span区别块元素和行内元素 <div> 标签可以把文档分割为独立的、不同的部分 <span> 标签被用来组合文档中的行内元素。 如果不对span设置样式，他跟其他文本是没有区别的 [HTML] 纯文本查看 复制代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">[/align]<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
</head>
<body>
<div style="color:#00FF00">
<span style="color:red">This is a header</span>
<span>This is a paragraph.</span>
This is a paragraph.
</div>
</body>
</html> | 
收藏
淘帖
踩
