집 > 기사 > Java > Java 웹에는 어떤 HTML 및 CSS 지식 포인트가 포함되어 있습니까?

Java 웹에는 어떤 HTML 및 CSS 지식 포인트가 포함되어 있습니까?

王林앞으로: 2023-04-23 14:49:141495검색

1.HTML

1.1 양식 태그: form

form 태그는 html 페이지에 양식을 생성합니다. form 태그는 브라우저에 아무것도 표시하지 않습니다. 데이터를 서버에 제출해야 하는 경우 데이터 수집을 담당하는 태그를 태그 본문 콘텐츠 형식에 배치해야 합니다.

작업 속성: 요청 경로, 양식이 서버에 제출되는 주소(경로)를 결정합니다

메소드 속성: 요청 메소드. 일반적으로 사용되는 값: get, post

　　get:기본값

제출된 데이터는 요청 경로에 추가됩니다. 예: /1.html?username=alex&password=1234, 데이터 형식 k/v, ? 연결을 사용하여 추가한 다음 각 데이터 쌍에 & 연결을 사용합니다

요청 경로 길이가 제한되어 있으므로 모든 가져오기 요청은 제한된 데이터를 제출합니다.

게시물：

제출된 데이터는 더 이상 요청 경로에 추가되지 않습니다(주소 표시줄에도 표시되지 않음)

제출된 데이터의 크기가 표시되지 않습니다

<body>
      <!-- 表单 -->
      <form action="" method="">
            <!-- 此处的内容可能被提交到服务器 -->
      </form>
      <!-- 此处的内容在<form>标签外部，此处数据不能提交到表单 -->
</body>

1.2 입력 필드 라벨: input

태그는 사용자 입력 정보를 얻는 데 사용됩니다. 유형 속성 값이 다르며 수집 방법이 다릅니다. 가장 일반적으로 사용되는 태그입니다.

rype 속성

텍스트: 텍스트 상자, 사용자가 텍스트를 입력할 수 있는 한 줄 입력 필드입니다. 기본 너비는 20자입니다

비밀번호: 비밀번호 상자, 비밀번호 필드. 이 필드의 문자는 검은색 원으로 표시됩니다.

라디오: 라디오 버튼, 상호 배타적인 옵션 버튼 세트 중 하나를 나타냅니다. 버튼을 선택하면 이전에 선택한 버튼이 선택 해제됩니다.

제출: 제출 버튼. 제출 버튼은 양식 데이터를 서버로 보냅니다. 일반적으로 name 속성은 작성되지 않습니다. 그렇지 않으면 "submit"이라는 단어가 서버에 제출됩니다.

프로젝트마다 요구되는 필드가 다르기 때문에 모든 양식 요소를 작성하지는 않았습니다. 다음 태그의 사용도 모든 사람이 숙지해야 합니다.

　　　체크박스：checkbox

Filee: 파일 업로드 구성 요소로, "찾아보기"를 제공하며, 업로드할 파일을 선택하려면 누릅니다.

숨김: 숨겨진 필드로, 데이터가 서버로 전송되지만 브라우저에는 표시되지 않습니다.

재설정: 재설정 버튼입니다. 양식을 기본값으로 복원합니다.

이미지: 이미지 제출 버튼, src를 통해 버튼의 이미지를 설정합니다.

버튼: 공통 버튼으로 JavaScript와 함께 사용되는 경우가 많습니다.

name: 요소 이름. 양식 데이터를 서버에 제출해야 하는 경우, 서버는 속성 값을 통해 제출된 데이터를 가져옵니다.

값: 입력 태그의 기본값을 설정합니다. 제출 및 재설정 버튼은 데이터를 제출합니다

사이즈：사이즈

Checked 속성: 라디오 버튼이나 체크박스가 선택되어 있습니다.

읽기 전용: 읽기 전용인지 여부

비활성화됨: 사용 가능한지 여부

maxlength: 입력에 허용되는 최대 길이

1.3 드롭다운 목록 라벨: select

<선택> 단일 또는 다중 선택이 가능합니다. 목록 항목을 지정하려면 하위 태그

다중 속성: 기본 단일 선택을 쓰지 마세요. 값은 다중 선택을 나타내는 "다중"입니다

크기 속성: 여러 항목을 선택할 때 표시되는 옵션 수입니다.

　　선택됨: 현재 목록 항목 확인

값: 서버로 전송되는 옵션 값입니다.

1.4 텍스트 영역 라벨: textarea

<텍스트 영역> 여러 줄의 텍스트 입력 제어.

cols 속성: 텍스트 필드의 열 수

행 속성: 텍스트 필드의 행 수

1.5 버튼 라벨: 버튼(이해)

2. DIV+CSS

2.1 div

란 무엇인가요? div는 영역을 나누는 일반적인 HTML 태그입니다. 특징: 전용라인. 복잡한 효과는 혼자서는 달성할 수 없습니다. 렌더링을 위해서는 CSS 스타일과 결합되어야 합니다.

div는 일반적으로 블록 수준 요소입니다

는 문서의 구분 또는 섹션(구분/섹션)을 정의할 수 있습니다.

태그는 문서를 독립적인 개별 부분으로 나눕니다. 엄격한 구성 도구로 사용할 수 있으며 이와 관련된 서식을 사용하지 않습니다.

에 ID나 클래스를 표시하면 태그의 효과가 더욱 커집니다.

2.2 CSS

개요 2.2.1 CSS란

CSS는 일반적으로 CSS 스타일 또는 캐스케이딩 스타일 시트라고 합니다. 주로 텍스트 내용(글꼴, 크기, 정렬 등), 이미지 모양(높이 및 너비, 테두리 스타일, 여백 등) 및 레이아웃을 설정하는 데 사용됩니다. HTML 페이지의 모양 표시 스타일.

CSS는 HTML 페이지를 더 보기 좋게 만들 수 있고, CSS 색상의 일치는 사용자를 더 편안하게 만들 수 있으며, CSS+DIV 레이아웃은 더 유연하며, 사용자에게 필요한 구조를 더 쉽게 그릴 수 있습니다.

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文档的头部标签体中，并且使用