search
HomeJavajavaTutorialWhat HTML and CSS knowledge points are involved in Java Web?

1.HTML

1.1 Form tag: form

The form tag creates a form on the html page. The form tag does not display anything on the browser. If the data needs to be submitted to the server, the tag responsible for collecting the data must be placed in the form tag body content.

Action attribute: request path, determine the address (path) where the form is submitted to the server

Method attribute: request method. Commonly used values: get, post

  get:Default value

The submitted data is appended to the request path. For example: /1.html?username=alex&password=1234, data format k/v, append using ? connection, and then use & connection for each pair of data

Because the request path length is limited, all get requests submit limited data.

Post:

The submitted data is no longer appended to the request path (neither displayed on the address bar)

The size of the submitted data is not displayed

      <!-- 表单 -->
      
                   
      

1.2 Input field label: input

The tag is used to obtain user input information. The type attribute value is different and the collection method is different. Most commonly used tags.

​rype attribute

text: text box, a single-line input field in which the user can enter text. Default width is 20 characters

Password: Password box, password field. Characters in this field appear in black circles.

radio: radio button, representing one of a set of mutually exclusive option buttons. When a button is selected, the previously selected button becomes unselected.

Submit: Submit button. The submit button sends the form data to the server. Generally, the name attribute is not written, otherwise the word "submit" will be submitted to the server.

Because different projects require different fields, I have not written out all the form elements. The use of the following tags also needs to be mastered by everyone.

   checkbox:checkbox

Filee: file upload component, provides "browse", press to select the file to be uploaded.

Hidden: Hidden field, the data will be sent to the server, but the browser will not display it.

Reset: Reset button. Restore the form to default values.

Image: Image submission button, set the image for the button through src.

Button: Common button, often used in combination with JavaScript.

name: element name. If you need to submit form data to the server, you must provide the name attribute value. The server obtains the submitted data through the attribute value.

Value: Set the default value of the input tag. The submit and reset buttons submit data

size: size

Checked attribute: The radio button or check box is selected.

readonly: Whether it is read-only

disabled: whether it is available

maxlength: The maximum length allowed for input

1.3 Drop-down list label: select

name attribute: the name sent to the server

Multiple attribute: Do not write the default single selection, and the value is "multiple" to indicate multiple selection

Size attribute: The number of visible options when selecting multiple items.

  selected: Check the current list item

Value: The option value sent to the server.

1.4 Text area label: textarea

cols attribute: the number of columns in the text field

rows attribute: the number of rows in the text field

1.5 Button label: button(understand)

2. DIV CSS

2.1 What is div

div is an ordinary HTML tag that divides areas. Features: Exclusive line. Complex effects cannot be achieved alone. Must be combined with CSS styles for rendering.

div is usually a block-level element

can define a division or section (division/section) in the document. The
tag divides a document into independent, distinct parts. It can be used as a strict organizational tool and does not use any formatting associated with it. If
is marked with an id or class, the tag becomes more effective.

2.2 Overview of CSS

2.2.1 What is CSS

CSS is usually called CSS style or cascading style sheet. It is mainly used to set the text content (font, size, alignment, etc.), image shape (height and width, border style, margin, etc.) and layout of the page in HTML pages. Appearance display style.

CSS can make HTML pages look better, CSS color matching can make users more comfortable, CSS DIV layout is more flexible, and it is easier to draw the structure that users need.

2.2.2 CSS名词解释

CSS(Cascading Style Sheets):指层叠样式表

  样式:给HTML标签添加需要显示的效果。

  层叠:使用不同的添加方式,给同一个HTML标签添加样式,最后所有的样式都叠加到一起,共同作用于该标签。

2.2.3 CSS样式规则

使用HTML时,需要遵从一定的规范。CSS亦如此,想要熟练的使用CSS对网页进行修饰,首先需要了解CSS样式规则。具体格式如下

选择器{属性1:属性值;属性2:属性值;..}

在上面的样式规则中,“选择器”用于指定CSS样式作用的HTML对象,花括号内是对该对象设置的具体样式。属性和属性值以键值对方式出现,使用英文冒号“:”分隔。多个属性之间使用英文分号“;”分隔。例如:

<style>
        h3{
            color: red;
            font-size: 100px;
        }
</style>

初学者在书写CSS样式时,除了要遵循CSS样式规则,还必须注意CSS代码结构中的几个特点,具体如下:

CSS样式“选择器”严格区分大小写,“属性”和“属性值”不区分大小写。

多个属性之间必须用英文状态下的分号隔开,最后一个属性后的分号可以省略,但是,为了便于增加新样式最好保留。

如果属性的值由多个单词组成且之间包含空格,则必须为这个属性值加上英文状态下的引号。例如:

p{font-family:"Times New Roman";}

在编写CSS代码时,为了提高代码的可读性,通常会加上CSS注释,例如:

/* 这是css注释文本,此文本不会显示在浏览器窗口中 */

在CSS代码中空格是不被解析的,花括号以及分号前后的空格可有可无。因此,可以使用空格键、Tab键、回车键等对样式代码进行排版,即所谓的格式化CSS代码,这样可以提高代码的可读性。例如:

h2{color: red; font-size: 20px;}

<style>
        h2{
            color: red;             /* 定义字体大小属性 */
            font-size: 20px;     /* 定义颜色属性 */
        }
</style>

上述两段代码所呈现的效果是一样的,但是,第二种书写方式的可读性更高。需要注意的是,属性的值和单位之间是不允许出现空格的,否则浏览器解析时会出错。例如,下面这行代码就是不正确的。

h2{ font-size:20 px;}    /* 20和单位px之间有空格 */

2.2.4 引入CSS样式

CSS使用非常灵活,即可以嵌入在HTML文档中,也可以是一个单独的文件,如果是单独的文件,则必须以.css为扩展名。CSS和HTML的结合3种常用方式:

(1)行内样式

行内样式,是通过标签的style属性来设置元素的样式。


小灰灰

java web的HTML和CSS知识点有哪些

 行内样式通过标签的属性来控制样式,这样并没有做到结构与表现(HTML展示结构、CSS显示效果)相分离,所有一般很少使用。学习阶段有时候为了快速编程,偶尔使用。

(2)内部样式

内部样式又称为内嵌式,是将CSS代码集中卸载HTML文档的

头部标签体中,并且使用