因为PHP擅长的是web开发。所以HTML也是phper需要了解的.
HTML知识点
基础篇
快捷键
ctrl+A 全选 ctrl+s 保存 ctrl+c复制 ctrl+v保存
ctrl+o 打开 ctrl+w 关闭 ctrl+p打印 ctrl+n新建
PS中快捷键
ctrl+ "+" 放大 ctrl+ "-" 缩小 ctrl+r 显示/隐藏标尺
ctrl+h 隐藏参考线 ctrl+d 取消选区
文件夹起名字要求
数字、字母、下划线，不允许使用汉字，不允许用数字开头
三原色：
红（red） 绿（green） 蓝（blue）
16进制：0-9和a-f随机组合3位或者6位，比如（#fof #abb123）
rgb(0-255,0-255,0-255)
图像的格式：
JPG PNG GIF JPEG BMP
建站点
新建文件夹：
文件夹（HTML）网页
文件夹（css）样式
文件夹（images）图片
HTML网页的基本格式
<!DOCTYPE html>
<html>
<head>
<title>网页的名字</title>
</head>
<body>网页的内容</body>
</html>标签的基本语法
单标签：<标签名 属性="属性值"> 例子：`<img src="">`
双标签：<标签名 属性="属性值">内容</标签名> 例子`<p style="color:red;">文字</p>`
列表
无序列表
<ul>
<li></li>
</ul> 无序列表的属性：type（类型）
属性值：square(小正方形) disc(实心圆，是默认值) circle（空心圆）
有序列表
<ol>
<li></li>
</ol> 有序列表的属性：type（类型） reversed（倒序显示） start（开始）
type属性值："1"(阿拉伯数字，是默认值) "a"（a-z） "A"（A-Z） "Ⅰ"（罗马数字ⅠⅡⅢⅣⅤ）
reversed（倒序显示）
例子
<ol type="A" reversed>
<li>文字</li>
<li>文字</li>
<li>文字</li>
</ol> 显示结果为
C 文字
B 文字
A 文字
start（从当前开始顺序显示，或者倒序显示）
例子1
<ol type="A" statr="B">
<li>文字</li>
<li>文字</li>
<li>文字</li>
<li>文字</li>
</ol> 显示结果为
B 文字
C 文字
D 文字
E 文字
例子2
<ol type="A" start="B" reversed>
<li>文字</li>
<li>文字</li>
<li>文字</li>
<li>文字</li>
<li>文字</li>
</ol> 显示结果为
F 文字
E 文字
D 文字
C 文字
B 文字
自定义列表
<dl>
<dt></dt>
<dd></dd>
</dl> 注意：dt和dd是同级，常用的格式是：dt放图，dd放字。一个自定义列表中，可以放很多个dd，但是只能放1个dt。
超链接：<a></a> 一对一 ---- 文字会变成蓝色，并且添加下划线
<a href="#">文字</a> # 代表的是空链接
属性：引入地址 href 目标打开方式 target="_self"原窗口 _blank 新窗口
表格：表格中的内容默认情况下 --- 水平居左 垂直居中
table 表格
属性：border边框 width宽度 height高度 align对齐方式（left/center/right）
bgcolor背景颜色 cellspacing 单元格间距 cellpadding单元格边距
tr 行
属性：align对齐方式（left/center/right） bgcolor背景颜色
td 单元格、列
属性：align对齐方式（left/center/right） bgcolor背景颜色
colspan 水平合并（合并的多列）
例子：colspan="5" 删掉本行(tr)中的4个列（td）
rowspan 垂直合并（合并的多行）
例子：rowspan="5" 删掉除过本行（tr）往下4个行（tr）每行的一个列（td）
细线表格的制作步骤：
1、给table设置边框border为0（可以不用写border）
2、给table设置背景色bgcolor，表格的背景色就是线的颜色
3、给每个tr设置背景色
4、给table设置单元格间距为1---- cellspacing="1"
表单
表单：用于显示，收集信息，并把信息提交给服务器
表单的结构：
<form>
<input type="...">（输入标签）
<selcet>（下拉菜单）
<option>内容1</option>
<option selected>内容2</option>
<option>内容3</option>
<select>
<textarea>（文本域，用于影评等）
</textarea>
</form>
表单的属性：action（服务器地址） name（表单名称） target（目标打开方式） method（提交方式）
表单属性的属性值： target（_blank新窗口打开 _self原窗口打开，是默认值） method（post隐式提交，提交数据时，内容不会显示在地址栏，安全性高，提交数据的大小也没有限制 get明文提交，提交数据时会显示在地址栏，安全性低，提交数据大小有限制，最大为2KB）
注意：如果有文件需要上传服务器，method（提交方式）必须改为"post"
输入标签
<input type="...">（表单控件，放在form中）
输入标签的属性：type（类型） name（名称） value赋值 checked默认选中（用于，协议等） placeholder光标获取
输入标签中type的属性值：
text（文本框）
password（密码框）
radio（单选框，同一组单选框中，必须给一个name，而且name的值要相同，不然，无法单选）
checkbox（多选框）
file（文件域）
image（图像域，具有提交功能）
submit（提交按钮）
reset（重置按钮）
button（普通按钮）
tel（电话）
email（邮箱）
url（网址）
number（数值， max最大 min最小 取范围）
date（日期）
datetime（世界时间，UTC时间）
datetime-local（本地时间）
color（颜色）
week（第几周）
month（几月，不是第几个月）
range（滑动轴）
**css篇**
三种样式表（三种样式表可以搭配使用）：
行内样式：直接在标签内部写 style="属性:属性值;" 例子<p style="color:red;">文字</p>
内嵌样式：在head之间写一个双标签<style></style>,在style之间写CSS
外部样式：新建一个CSS样式表，再用link导入
三种样式表的优先级： 行内样式>内嵌样式>外部样式
文字属性
font-size文字大小 网页中，正文（12px）标题（14px）
font-color文字颜色
font-family文字字体 黑体、宋体等
font-style字体倾斜（italic倾斜 normal正常字体）
font-weight文字加粗（bold/bolder加粗 noamal正常字体）
text-decoration文本修饰（underline下划线 overline上划线 line-through删除线 none去掉下划线）
text-align文本对齐（left左 center中 right右）
text-indent文本缩进
line-height行高
背景属性
background-color背景颜色
background-image:url(../images/a.png);背景图片
background-repeat背景图片重复（repeat默认值 no-repeat不重复 repeat-x水平方向重复 repeat-y垂直方向重复）
background-position背景图片位置 先水平（left/center/right，像素） 后垂直（top上/center中/bottom下，像素）
background-size背景图片的尺寸 先水平（百分数，像素） 后垂直（百分数，像素）
列表属性
list-style：none；去掉项目符号
浮动： float：left/right/none；
**div篇**
元素分类：
1：行内元素：在一行内显示，元素前后没有换行效果，不会自动换行，在css添加width和height，不会起作用
2：块元素：一个标签独占一行，元素前后带有换行效果，在css中添加任何属性都起作用
3：可变元素：button/input
行内元素例子 b / i / u / img / a / em / strong / span
块元素例子： h1-h6 /p / ul / ol / li / dl / dt / dd / table / form / div
254
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
