【javaweb学习笔记】WEB02_HTML&CSS


一、表单相关知识

1.表单:

  所有需要提交到服务器端的表单项必须使用

括起来

  form标签属性(有两个):

    1)action,整个表单提交的位置(可以是一个页面,也可以是一个后台java代码)

    2)method,表单提交的方式(get / post / delete ... ...等7种)

       get提交方式:所有的内容显示在地址栏,不够安全,长度有限制

       post提交方式:所有的内容不会显示在地址栏,比较安全,长度没有限制

2.表单标签:

  1)文本输入项:

  2)密码输入项:

  3)单选按钮:

  4)多选按钮:

  5)下拉列表:

    

  6)文件上传项:

  7)文本输入域:

  8)提交按钮:

  9)普通按钮:

  10)重置按钮:

  11)隐藏项:

3.表单标签及属性代码


  


    隐藏字段:

    用户名:

    密码:

    确认密码:

    性别:
    

    爱好:钓鱼
    打电动
    写代码

    头像:

    籍贯:

    自我介绍:
      

    提交按钮:

    普通按钮:

    重置按钮:
  

二、div和span

1.div:是一个html标签,一个块级元素(单独显示一行)。它单独使用没有任何意义。必须结合CSS来使用。主要用在页面的布局。

2.span:是一个html标签,一个内联元素(显示一行)。它单独使用没有任何意义。必须结合CSS来使用。主要用于对摞起来的内容进行样式的修饰。

三、CSS

1.作用:

  HTML:它是整个网站的骨架

  CSS:它是对整个网站骨架的内容进行美化(修饰)

2.引入方式(3种):

  1)行内引入

  2)内容引入方式

  3)外部引入

3.基本选择器(3种):

  1)ID选择器:(保证唯一性

      #id 属性名{

        属性名n:属性值n;    最后一行的分号可以省略,但最好不要省略。

  2)元素选择器:(一般所有的元素设置相同样式时使用)

      元素名{

        属性名n:属性值n;

  3)类选择器:(一般较多元素设置相同样式时使用)

      .类名{

        属性名n:属性值n;

4.其他选择器:

  1)层次选择器:

      元素名 子元素名{

        属性名n:属性值n;

  2.属性选择器:

      元素名[属性名 = "属性值"]{

        属性名n:属性值n;

      如:input [ type = "text" ] {

          ... ...

5.浮动:

  浮动的框可以向左或向右移动,知道它的外边缘碰到包含框或另外一个浮动框的边框为止。

  由于浮动框不在文档的普通流中,所以文档的普通流中的块框表现得就像浮动框不存在一样。


四、补充:

1.去掉超链接下划线:

  a{

    text-decoration : none;

2.让div居中:

  margin:0px auto;

3.让块级元素称为内联元素

  display : inline;

4.块级元素内容居中:

  text-align : center;