黑马程序员技术交流社区
标题: 【石家庄校区】笔记 [打印本页]
作者: 庞帅 时间: 2018-5-3 14:24
标题: 【石家庄校区】笔记
本帖最后由 庞帅 于 2018-5-3 15:42 编辑
表单标签
<form action=”表单数据提交的地址--->默认提交到当前页面”
method=”提交方式--->常用的有get和post，默认为get”
注意：GET：数据显示到地址栏中，有大小限制
POST：数据不会显示到地址栏中，无大小限制
表单元素：
表单的输入：<input >
根据type属性有不同的输入类型：
Ø Date ：显示的是日历输入
Ø Email：邮箱输入格式
Ø Number：数字的输入格式
Ø Color：颜色的输入格式
Ø Text：文本框输入格式
Ø Checkbox：复选按钮
Ø File：上传
Ø Submit：提交按钮
Ø Reset：重置按钮
Ø Button：普通按钮，没有任何功能
Ø Image：图片按钮
Ø Hidden：隐藏字段
表单文本域：textarea
Ø Rows：行数
Ø Cols：列数
表单下拉列表：select
<selsct selected：默认选择>
<option > </option>
</selsct>
常用属性：
Name：表单元素的名称，必须有属性，后台才可以接收数据
Value：文本框默认值
Size：文本框长度
Maxlength：文本框输入的最大长度
Readonly：只读文本框
Disabled：废弃文本框
Password：密码框
Radio：单选按钮
checked：默认被选中
表格
<table cellspacing = “表格之间间隙空间”align = “表格位置”
Border = “边框”>
<tr>-->行
<td colspan = “列合并”rowspan = “行合并”>-->列</td>
</tr>
图片
<img src = “图片来源(相对路径)”alt=“图片找不到时出现”/>
注意：px是像素单位
超链接
<a href = “超链接的路径”target = “打开方式：_self在自身页面打开，_blank新打开一个窗口,_parent = “在框架中使用”></a>
有序列表
<ol type=”数字，英文，罗马字符（i）” start= “从哪开始”>
<li>列表项</li>
</ol>
无序列表
<ul type=”disc：点 ，circle：空心圆，sequare：“方块”>
<li>列表项</li>
</ul>
<font size=”字体大小(1-7)“ face=”字体”></font>
排版标签
<!-- html的标题标签-->：注释
<h1></h1>
<h2></h2>：1-6
<p></p>:段落标签
<b></b>:字体加粗标签
<i></i>:斜体标签
<u>:下划线标签
<center>:居中标签
标签可嵌套
<br/>换行
<hr/>横线分隔线
<pre>：原生标签
空格
框架标签
<frameset rows = “行切割”cols = “列切割”>
<frame src = “引入页面地址” name = “地址名”/>
注意：
Frame：代表切分成的每个部分
Frameset：与body冲突，不可同用
【HTML的块标签】
<div></div> :默认一个div独占一行.
<span></span> :默认在同一行.
CSS
【CSS的选择器】
Ø 元素选择器：
div{
border:1px solid blue;
width:40px;
height:45px;
}
Ø ID选择器：
#d1{
border:2px solid red;
}
Ø 类选择器：
.divClass{
border:2px solid yellow;
}
Ø 后代选择器：
div a{ }
Ø 子元素选择器：
div > span找这个div中的第一层级的span元素.
【CSS的浮动】
Ø 使用float属性可以完成DIV的浮动.
Ø 清除浮动效果：使用clear属性进行清除
#d3{
float:left;
}
.clear{
clear:both;
}
css中的盒子模型
Ø 内边距：
Padding：
H{padding：10px}
H{padding:top上，right右，bottom下，left左}
Ø 外边距：margin
Css中的定位：
Position：定位属：
Relative：相对定位
Absolute：绝对定位
Fixed：相对定位
Ø 使用另外两个属性：left,top
Dispaly:none :隐藏 block显示
Ø 伪类：
A:Link:没动之前（为访问的链接）
A:Visited：动了之后（已访问的链接）
a:hover:悬停（鼠标移动到到链接上）
A:Active：放上去之后（已选定的链接）
| 欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) |
黑马程序员IT技术论坛 X3.2 |