HTML

表头

行

行内格

table中：aligh="center leht right" 对其方式[左，中，右]

rowspan="" 合并行

colspan="" 合并列

  空格

  两个空格

  三个空格

【表单标签】

action="/java2212/login"指定后台服务器路径

输入框

text 文本输入

password 密码框，密文

radio 单选框，多框同name值

checkbox 复选框，多框同name值

date 日期

range 范围滑动框

file 文件

email 邮箱

button 可点击按钮

submit 可点击提交

reset 可点击重置

name值，用

value="默认值"

name="" 暂时不用，java用name获取输入框的值

placeholder="输入提示" 输入框提示

选项框

选项

可变大小文本域

【框架集标签】

cols将页面按照列分为几比几

rows将页面按照行分为几比几

【框架标签】

将a页面设置为target="namesss"

当a标签的页面内容指定在iframe内，就可以实现一个页面中的iframe实现可以打开多个页面

CSS

CSS叫层叠样式表,用来美化HTML,

也可以配合脚本动态的改变样式

提供代码复用,

与HTML代码分离,方便后期维护

使用方式

1、CSS样式与HTML标签在一起

在标签内，引入style

2、css样式与html标签分离，但不出，使用

给标签id，css中用（#id名字）做连接

3、css文件和html文件分离

1.得有html和css文件

2.在html中的head内中使用link引用css文件

语法格式

选择器

语法格式:

id选择器【重点】

用标签中定义的id来与css进行联系，一个id对应一个标签

class选择器【重点】

和id格式基本一样，但class可以被多个标签同时调用

岳阳楼

岳阳楼上日衔窗，

影到深潭赤玉幢。

怅望残春万般意，

满棂湖水入西江。

属性选择器

层级选择器

组合选择器

选择器1,选择器2{

}

两个选择器会同时生效,两个选择器是平级关系

css属性

文字属性

font-family: 宋体; /*更改字体*/

font-size: 35px; /*更改字体大小*/

文本属性

color: red; /*字体颜色*/

text-align: center; /*文本居中*/

text-indent: 20px; /*缩进*/

背景属性

backgrouond-color： 颜色; /*更给背景颜色*/

background-image：url("图片地址")/*背景图片*/默认平铺background-repeat：no-repeat; /*不平铺*/

repeat-x; // repeat-y; /*x或y轴平铺*/

background-size:250px; /*背景图片大小*/

background-position: bottom; /*背景图片的地方*/

列表属性

.l1{

list-style-image: url("img/数字-1.png");

/*在列表中添加图片，比如[1]这样的序号小图片*/

尺寸属性【重点】

width:100px; 或者 100%;

height:100px; 或者 100%;

显示属性【重点】

display: none; /*不展示*/

display: block; /*显示: 按块显示*/

display: inline; /*显示,按行内显示*/

浮动属性float

float: right; /*浮动,会脱离当前的文档流*/

定位属性【重点】

相对定位

/*相对定位不会脱离原来的文档流

加了定位就可以使用位置属性: left,right,top,bottom

相对与父级进行位置移动*/

position: relative; /*相对定位*/

left: 30px;

top: 30px;

绝对定位

/*绝对定位会脱离原来的文档流

绝对定位是根据页面左上角进行位置移动*/

position: absolute; /*绝对定位*/

left: 30px;

top: 30px;

查看原文