首页 > > 网页制作 > css >

JavaWeb_01_html基本学习

2018-06-24 01:38:14来源：未知阅读 ()

JavaWeb01_html basic

html操作思想

使用标签把要操作的数据包起来，通过修改标签的属性值，来实现标签内数据样式的变化

font标签

属性：size取值范围1-7 color：英文单词，十六进制数 #ffffff

标题标签 `<h1> </h1> ... <h6> </h6>`

从h1到h6越来越小，自动换行

注释

列表标签

<dl> <dt></dt> <dd></dd> </dl>
有序
无序

图像标签

<img src="图片的路径" width="" height="" alt="" />
alt:浏览器的兼容性很差

路径（相对路径）

超链接标签

<a href="路径">显示在页面上的内容</a>

打开方式 target=”_self _blank”
默认是在当前页面打开

表格标签

<table>
    <tr>
        <td></td>
        <th></th>   <!--加粗和居中-->
    </tr>
</table>

html的五个规范

一个html文件开始标签和结束的标签<html>和</html>
html包含两部分内容
- <head>设置相关信息</head>
- <body>显示在页面上的内容都写在body里面</body>
html的标签是成对的
html的代码不区分大小写
有些标签，在标签内结束。比如换行:<br /> 分割线:<hr />

表单标签

可以提交数据到服务器，这个过程可以用表单标签实现
<form>和</form>
- action:提交到地址，默认提交到当前页面
- method:表单的提交方式
  - 常用的有两种 get和post get默认就是get请求
- enctype: 一般请求下不需要这个属性，做文件上传时候需要设置这个属性
- 面试题目：get和post区别
  - get请求地址栏会携带提交的数据，post不会携带
  - get请求安全级别较低，post较高
  - get请求数据大小的限制，post没有限制
输入项：可以输入内容过选择内容的部分
- 大部分的输入项使用 <input type="输入项的类型"/>
  - 普通输入项：<input type="text"/>
  - 密码输入项：<input type="password"/>
  - 单选输入项：<input type="radio"/>
    -> 在里面需要属性name
    -> name的属性值必须要相同
    -> 必须有一个value值
  - 复选输入项：<input type="checkbox"/>
    -> 在里面需要属性name
    -> name的属性值必须要相同
    -> 必须有一个value值
  - 文件输入项（在后面上传时侯用到）
    -> <input type="file"/>
  - 下拉输入项（不是在input标签里面的）
```
<select name="birth">
    <option value="0">请选择</option>
    <option value="1991">1991</option>
    <option value="1991">1992</option>
    <option value="1991">1993</option>
    <option value="1991">1994</option>
</select>
```
  - 文本域
    <textarea cols="10" rows=""></textarea>
  - 隐藏项（不会显示在页面上，但是存在于html代码里面）
    <input type="hidden"/>
  - 提交按钮
    <input type="submit"/>
    <input type="submit" value="注册"/>
  - 使用图片提交
    <input type="image" src="a.jpg"/>

html中其它的常用标签的使用

b –加粗
s –删除线
u –下划线
i –斜体
pre –原样输出
sub和sup –下标和上标
div –自动换行
span –在一行显示

html头标签的使用

html两部分组成 head和body
- 在head里面的标签就是头标签
- title标签：表示在标签上显示的内容
- <meta>标签：设置页面的一些相关的内容
  - <meta name="keywords" content="学习,熊出没"> –以前的搜索引擎检索方式
  - <meta http-equiv="refresh" content="3; url=https://baidu.com"/> –三秒跳转
- base标签：设置超链接的基本设置
  - 可以统一设置超链接的打开方式<base target="_blank" /> –设置全文超链接以新窗口打开
- link标签：引入外部文件
  - 可以使用link标签引入css文件

框架标签的使用

使用框架标签的时候，不能写在body里面，使用了框架标签，需要把body去掉

<frameset>标签
- rows:按照行进行划分 <frameset rows="80, *">
- cols:按照列进行划分 <frameset cols="80, *">
<frame>标签
- 具体显示的页面
  - <frame name="lower_left" src="b.html">