1.Lamp网站构建
1.1基础概念
1.1.1LAMP网站的构建
- B/S 架构 【浏览器----服务器】，比如京东，淘宝，知乎
- C/S 架构 【客户端----服务器】，比如微信，QQ，LOL
PHP属于B/S结构软件
1.1.2网站工作流程
- 请求 【浏览器发URL给服务器】 request
- 响应 【服务器发资源给浏览器】response
1.1.3统一资源定位符
URL
http://www.jd.com/list.html?c=user&a=del&uid=17
- http/https ：传输协议【超文本传输协议& 安全版SSL传输协议】
- www.jd.com : 域名【表示向哪个服务器发出资源请求】
- / ：网站根目录
- list.html 【文件名，请求的具体内容】
- ？：后面跟的是参数 【多个参数之间需要用&分隔，且实际工作中&两旁不能有空格】
端口
HTTP和HTTPS文本传输协议使用的端口号不一样。
服务器上有 65535个端口，其中：
HTTP使用的时80端口
HTTPS使用的是443端口 {SSL}
状态响应码
200---------成功
403---------拒绝
404---------没找到
500---------服务器内部错误
1.1.4动态网站
网站服务与数据库的结合，根据查询数据库所得到的网页不同。
动态网站架构
浏览器：用于解析网页代码显示屏幕上
CSS：修饰网页内容，大小，颜色，样式，位置
HTML：标记网页内都有什么内容
客户端脚本语言: 用户交互，页面特效
服务器：负责响应，把网页发给浏览器
服务器脚本语言：生成页面
数据库f’f’d’d’f: 存储数据
1.1.5开发平台 LAMP
Linux - apache - mysql - php 一种黄金炸鸡搭配
1.1.6超文本
HTTP: 超文本传输协议
HTML：超文本标记语言
PHP：超文本预处理器
浏览器：超文本解释器
1.1.6.1超文本传输协议
HTML - 超文本传输协议
超文本----超链接
标记----标签
浏览器会按照标签内容把文件渲染成网页。HTML不是编程语言，是一种标记语言
编码格式--------UTF-8无BOM格式编码
1.1.6.2HTML 主体结构
<!DOCTYPE html> <!-- 告诉浏览器用最新的HTML标准来解析该文档 -->
<html> <!-- 告知浏览器这是一个 HTML 文档-->
<head> <!-- 头部 告诉浏览器的内容 -->
<meta charset="utf-8" />
<title>主体结构</title> <!--定义网站的标题-->
</head>
<body> <!-- 身体 要让浏览者看到的内容放这里(比如文本、图像、颜色、图形等等) -->
<!--
注释的作用:
1) 对代码的解释和说明
2) 注释的代码不被执行
3) 注释的内容不会显示在页面上
-->
</body>
</html>
1.1.7字符集 字符 编码
字符：【一个文字一个标点就是字符】
字节：【B是字节 】1kb=1024b; 1mb=1024kb; 1gb=1024mb; 1Tb=1024GB;1Pb=1024Tb;
HTML 概述
网页基础架构
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="description" content="网页内容介绍"/>
<meta name="keyswords" content="关键字"/>
<!-- 网站定时刷新-->
<meta http-equiv="refresh" content="5;url=http://www.baidu.com" >
<title>网页title</title>
</head>
<body></body>
</html>
字符实体
> ----------- >
< ------------ <
  ---------空格
常用标签
标题标签
<h1></h1> ------大
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>-------小
文本格式化标签
<b></b> -------------加粗
<i></i>--------------斜体
<del></del>----------删除线
<strong></strong>-----强调，状态是加粗
<em></em>-------------强调，状态是斜体
<sup></sup>-----------上标字
<sub></sub>-----------下标字
<hr />--------------- 换行
<big></big/>----------比正常字大一些
<small></small>-------比正常字小一些
计算机输出标签
<code></code>
<kbd></kbd>
<pre>
- -
- - - -
- - - - - -
</pre>
写文章术语标签
<bdo dir="rtl">cscsc</dbo> <!-- 会从右到左显示 -->
<city></city> -----------引用名著
<abbr title="world wide web">WWW</abbr>
<q></q>------------标记短的引用
文本标签
<p></p> ---------段落之间默认，独占一行，一个段落之间含有默认的上下间距
列表
有序列表
<ol>
<li></li>
<li></li>
</ol>
无序列表
<ul>
<li></li>
<li></li>
</ul>
定义列表
<dl>
<dd></dd> -------- 需要定义列表中的每一项
<dd></dd>
</dl>
超链接
<!--
引用地址分为相对地址和绝对地址
相对路径: 相对于引用文件本身去定位被引用的文件地址
. 表示当前文件所在目录下 但在使用时也可以省略
.. 表示当前文件所在目录下的上一级目录
-->
<!--
绝对地址：相对于磁盘或者网站域名根目录的位置去定位文件的地址
/ 代表服务器根目录, 网站上的页面都存在它下面
根据实际情况, 它会是系统中的某一个特定的文件夹
-->
<!--
带参数传递, 同时把一些数据传递过去,这些数据称为参数
-->
<a href="htttp://www.baidu.com">点击一下</a>
<a href="./default.html">default</a>
<a href="../default.html">default</a>
<a href="./3.php?id=20"></a>
target属性
<a href="http://www.baidu.com" target="_blank">点击一下</a> -------- 新窗口打开
<a href="http://www.baidu.com" target="_self">点击一下</a> --------- 在当前窗口打开
锚点
<a name="one" >锚点</a>
<a href="#one" >跳转到锚点</a>
图像超链接
<a href="http://www.baidu.com">
<img src="./images/a.jpg">
</a>
多媒体
<audio src="zoe.mp3"></audio>
<video src="zoe.mp4" autoplay controls loop ></video >
<embed src="fun.mp4" />
子窗口
<iframe src="./abc.html" name="test"></iframe>
<a href="地址" target="test">跳转</a>
<!--
水平对齐 align left center right 左 中 右
垂直对齐 valign top middle bottom 上 中 下
-->
<table>
<tr>
<th></th>
<th></th>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>
<!--横向合并-->
<td colspan="2"></td>
<!--纵向合并-->
<td rowspan="2"></td>
表单
<form action="./x.php" method="get">
账号：<input type="text" name="uname" value="cd" />
密码：<input type="password" name="pass" value="cc"/>
提交：<input type="sumit" value="submit" />
</form>
- action : 数据提交的位置
- method：
- get: 提交后数据会在url里显示 长度不宜过长
- post: 提交后，不会在在url 显示， 相对安全
type='text'--------- 单行文本框
type='password'--------密码框, 输入的内容会被星号或小圆点代替
type='radio' -----------单选框
type='checkbox' -----------多选框
type='hidden'------------隐藏域
type='file' ------------ 文件上传
type='submit'------------提交按钮
type='reset'------------重置按钮
type='color' ------------ 可以选取颜色
type='number'-----------单行输入框中只能输入数字
type='range'-------数值范围的滑块
type='date'---------点选日期控件
文本框
文本框： <input type="text" placeholder="姓名" required autofocus maxlength="3" size="8" />
required --- 必填项目
autofocus--- 光标闪烁
disable----不能输入修改
单选框
单选框： <input type="radio" name="sex" valu
e="x" />女
check----表示默认选中
实现单选按钮就有被选中的感觉需要用到<label>
1.
<label><input type="radio" name="sex" value="w"/>女</label>
2.
<label for="one"></label>
<input type="radio" name="sex" value="w" id="one"/>女
多选框
城市：
<select name="city">
<option value="bj" >bj</option>
<option value="sh" >sh</option>
<option value="gz" >gz</option>
</select>
隐藏域
在页面上不显示
<input type="hidden" name="uid" value="17" />
文件上传
在表单里实现文件上传需要在表单定义里加上enctype="multipart/form-data"
<form action="./p.php" method="post" enctype="multipart/form-data">
<input type="file" name="myface"/>
</form>
文本域
<textarea name="x" ></textarea>
提交按钮
<input type="submit" value="提交" />
<input type="image" src="./d.png" >
数字框
<input type="number" step="0.1" min="0" max="100" />
step ---每次增加多少 或者减少多少
860
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
