本帖最后由 tuzibumaimeng 于 2018-4-5 21:50 编辑
HTML
1.前端的组成:HTML, CSS, JS
2.HTML：用户展示数据的超文本标记语言。
超文本：比普通文本更加强大的文本。
标记语言：指通过一组标签的形式用于描述事物的语言。
3.HTML的作用和使用：用于制作静态页面(其页面数据不是从数据库中得到)；在设计网站页面的时候使用。一个HTML文件扩展名以.html或.htm结尾。
4.框架标签
<html>（跟标签）
<head>（头标签）
<meta charset="utf-8" />
<!--告诉浏览器以什么编码打开html文件，如果.html文件是UTF-8，charset="utf-8" ,如果.HTML文件是GBK,charset="GBK"-->
<title>网页的名字</title>
</head>
<body>（体标签）
</body>
</html>
5.字体标签：<font size="7" face="微软雅黑" color="hotpink">你好张三</font>
6.排版标签
加粗 <b>加粗</b>
下划线 <u>下划线</u>
斜体 <i>斜体</i>
段落 <p>段落</p> 上下会有间距
标题 h1 一级标题 h2 二级标题...h6六级标题
换行 <br/>
空格
居中：center
<pre>标签：原生标签.?
<hr/>标签：横线.
7.HTML5不仅仅是对标签的增强，实际上是对HTML标签+CSS+JS的增强
8.图片标签
<img src="图片路径" alt="图片不能正常加载提示的文字" width="100" height=""/>
长度和宽度默认单位PX, PX就是拿放大镜看到的屏幕上的像素点
9.列表标签
无序标签
<ul style="list-style: none;">
<li></li>
</ul>
黑点显示，list—style：none表示隐藏黑点
有序标签
<ol>
<li></li>
</ol>
数字序号显示
10.超链接
href:链接的路径；target：打开方式
<a href="http://www.baidu.com" target="_parent">百度</a>
target:_blank 在新窗口打开
_self 在当前窗口打卡
_parent 在父窗口打开 明天讲框架标签的时候演示
11.表格标签
功能：展示数据和页面布局(过时了)
td有两个属性 rowspan 合并行, colspan 合并列。表示rowspan=行数；colspan=列数
<table width="100px" height="100px" border="1px" >
<tr>
<td>第一列</td>
<td>第二列</td>
</tr>
<tr>
<td>第一列</td>
<td>第二列</td>
</tr>
<table>
12.表单标签
HTML表单标签:<form>
常用属性:
action属性:提交的路径.默认提交到当前页面
method属性:请求的方式.GET和POST.默认是GET.
GET方式和POST方式的区别?
GET:数据会显示到地址栏中，有安全隐患，GET方式提交是有大小的限制.
POST:数据不会显示到地址栏中，比较安全，POST方式提交的是没有大小限制.
文本输入框<input type="text"/>
密码输入框<input type="password"/>
下拉框<select></select>
单选框<input type="radio"/>
多选框<input type="checkbox"/>
文件上传<input type="file"/>
普通按钮<input type="button" value="点我呀"/> <button type="button">点我呀</button>
提交按钮<input type="submit" value="点我呀"/>
<button type="submit">点我呀</button>
重置<input type="reset" value="点我呀"/>
<button type="reset">点我呀</button>
文本域<textarea></textarea>？
隐藏域<input type="hidden">？
input标签的属性
name 表单元素名称，提交数据的必须有name属性，后台才能接受数据
value 给当前标签设置值的
maxLength 允许输入字符的最大长度
readonly 只读
下拉框设置默认值：
<select>
<option value="1">芒果</option>
<option value="0" selected>香蕉</option>
<option value="1">榴莲</option>
</select>
13.表单标签注意事项
所有的表单标签都应该嵌套在form标签内
同一组单选框或者多选框他们的name属性要保持一致
多选框和单选框设置默认值是checked属性
下拉框设置默认值是给option添加selected属性
<textarea>默认值</textarea>
剩下的input标签设置默认值是通过value指定
14.框架标签
frameset
rows = "20%, 80%"
cols = "20%, *"
frame
src 指定要显示的页面
name 为了方便超链接跳转
frameset标签中可以嵌套frame标签和frameset标签，但是用于展示数据的是frame标签
frame用于展示页面，frameset用于分隔页面
注意事项：不能和body共存
15.转义字符
空格
< 小于号
> 大于号
16. 开发常用标签 div span a i 列表ul
div和span标签
div:块级元素 独占一行，可以设置宽和高
span:行内元素 一行可以显示多个，不可以设置宽和高
相互转换
块级转行内 ：添加样式display:inline;
行内转块级： 添加样式display:block;
行内块级元素(一行可以显示多个，并且可以设置宽和高)：display:inline-block;
在开发的时候常用的block,inline-block,inline
表格布局的缺陷：1.不灵活2.页面加载速度没有div快
|
|
收藏
淘帖
踩
