JavaWeb第一天
HTML概述:Hyper Text MarkupLanguage 超文本标记语言
l 标记语言:通过一组标签的形式描述事物的一门语言
l 超文本: 比普通的文本具有更多功能
HTML作用: 用来制作网页页面(静态页面)
HTML应用场景: 设计网站时候来应用
HTML使用:
创建HTML文件: HTML文件,以后缀名为.html或.htm结尾
HTML的结构标签:
n 根标签:<html></html>
n <head> html 头标签
n <body> html 体标签
图片标签:<img>
n 属性:
u Src: 图片的数据源
u Width:图片的高度
u Height:图片的宽度
u
列表标签:
l 有序列表
n <ol></ol>
u 属性type:1,A,a,罗马字符.
u 属性start:从多少开始,(只针对数字有效果)
l 无序列表标签
n <ul> </ul>
u 属性type: disc:实心点,circle:空心圆,square:方块
超链接标签
<a></a>
属性:
n Href :链接的路径
n Target: 打开方式
u _self :在自身页面打开
u _blank :新开一个窗口
u _parent:占用整个父窗口
表格标签:
<table>
<tr>
<td></td>
<td></td>
</tr>
</table>
属性:
n Width :表格的宽度
n Height :表格的高度
n Border :边框
n Align :表格水平位置
u Left :最左
u Right :最右
u Center :居中
<td>属性:
合并单元格
n Colspan :列数
n Rowspan :行数
表单标签:
<form></form>
属性
Action:提交的路径,默认提交当前界面
Method:提交的方式,get或post方式’
Get :不安全数据会被显示在地址栏中,提交数据有大小限制
Post :安全,数据不会被显示在地址栏中,提交无大小限制
子标签
n <inputtype = “text”> :文本框
u Name : 表单元素的名称,通过name后台获取数据
u Value :文本框的默认值
u Size :文本框长度
u Maxlength:文本框输入长度
u Readonly :不可改写文本框
n <inputtype = “password”> :密码框
n <inputtype = “radio”> :单选按钮
u Checked:单选按钮默认被选中
n <inputtype = “checkbox”> :复选按钮
n <inputtype = “button"> :没有任何作用的按钮
n <inputtype = “reset”> :重置按钮
n <inputtype = “submit”> :提交按钮
n <inputtype = “file”> :文件上传的表单项
n <inputtype = “hidden”> :隐藏字段
n <inputtype = “image”> :图片按钮
n <select> :下拉列表
n <textarea> :文本域
JavaWeb第二天
框架标签<frameset>,
框架标签与body标签冲突,有frameset可以不用body
属性:
Rows:
Cols :
使用<frame>标签,代表切割的每个部分
表格布局的缺陷
较为死板
块标签<div>
默认独占一行
<span>
默认在同一行
Css:层叠样式表(cascading Style Sheets)
样式定义如何显示HTML元素
样式存储在样式表中
解决内容与表现分离的问题
外部样式表可以提高工作效率
外部的样式通常储存在css文件中
多个样式定义可层叠为一
Css的基本语法
1. 选择器
选择器{ 属性:值;属性:值……..}
i. 元素选择器
ii. Id选择器
iii. 类选择器
作用顺序元素选择器<类选择器<id选择器
2. 声明
css的三种引入方式
行内样式:直接在HTML的元素中使用Style属性设置css
<h1 style=“color:red;”>标题</h1>
页面内样式:在HTML的<head>标签中使用<style>标签设置CSS
<style>
h1{
color:blue;
font-size:40px;
}
</style>
外部样式:单独定一个.css的文件,在HTML中引入该CSS文件。
<link href = “../../css/demo.css”rel = “stylesheet” type=”text/css”/>
浮动属性float
值:left:向左浮动
Right:向右浮动
None:默认,不浮动
Inherit:规定应该从父元素继承float属性的值
清除浮动效果:使用clear属性清除
值:left:在左侧不允许浮动
Right:在右侧不允许浮动
Both:在左右两侧不允许浮动
None:默认
Inherit:规定应该从父元素继承clear属性的值