风也温柔

计算机科学知识库

css标题样式 JAVAWEB-前端HTML、CSS、JavaScript期末复习知识点总结

  为了考试复习方便 下面内容摘自

  前端HTML、CSS、知识点总结 一、HTML 1.前端组成

  (1)前端的组成:内容(HTML)+样式(CSS)+页面交互特效();

  (2)前端编译(解析)器:浏览器

  浏览没有统一,所以每个浏览内核不同,导致同一个页面用不同,浏览器 解析出效果不同(兼容性)。

  (3)前端开发工具:

  记事本,++,,,,,,idea

  2.html

  (1)定义:超文本标记语言,是一种由标签组成的语言,每个标签都有自己的 意义。

  (2)后缀名是.htm 或.html的文件。

  (3)html规范:

  1)html不区分大小写,但是W3C提倡标签名和属性名全用小写。

  2)html页面必须有根标签,根标签必须是

  3)html标签必须关闭:

  单标签:

  双标签:

  4)html的标签的属性值一定要写在引号中。

  5)html的标签都已经定义好了,每个标签都有独特含义,不能自定义。

  6)html的标签可以嵌套,嵌套要正确。

  (4)html组成:文档声明+html基本结构.

  (5)html的文档声明:

  1)(严格类型):

  2)(过渡类型):

  3)(框架类型):

  (6)HTML的标准结构

   - --- 根标签

     
              ---头部分(指定编码以及窗口标题)
     
                 ---- 执行编码格式
     
                指定标题
     
            
     
            
     
                主体部分,所有的常用的html标签都这里。
        
            
     
        

  (7)html注释:

  3.html中头部常用标签

  (1)页面标题标签:

  (2)设置页面字符编码:

  (3)网页描述:

  (4)设置搜索关键字:

  (5)设置当前页面几秒后跳转到另一个页面:

  (6)导入外部css文件:

  (7)囊括书写的css内部样式:

  (8)囊括和导入js代码

  4.html中body常用标签 4.1.块级标签:标签要独占一行

  (1)标题标签:设置标题

  ~字体由大到小。

  (2)段落标签:

  (3)水平线标签:

  (4)无序列表:类型(实心圆,空心圆,方块)

  

     
            面条
     
            泡面
     
            燕窝
     
        

  (5)有序列表:类型(数字,字母,罗马数字)

  

     
            苹果
     
            梨
     
            橘子  
     
        

  (6)自定义列表:用于对概念的解释说明,或图文混排

  (7)容器标签:

  (8)表格标签:

  (9)表单标签:

  4.2.行级标签(内联标签):内容有多大占多大的位置

  (1)换行标签:

  (2)段落缩进标签:,段落首行缩进

  (3)滚动标签:,没有指定滚动方向,默认从右到左。

  1):滚动方式

  slide:滚动到某一边停止

  :来回滚动(两端)

  :穿梭滚动

  2):滚动方向,left(从右往左),right(从左往右)。

  3):滚动速度。

  4)举例:

   XXXXXXXXX

  (4)上标标签:sup,给某个文本设置上标。

  举例:数学中的幂(平方、立方):X2。

  (5)下标标签sub,给某个文本设置下标。

  举例:化学中的化学式:H2O H2O。

  (6)原样输出标签:pre,被包裹的文本原样显示:

  <pre></pre>

  (7)行内标签span:

  (8)加粗标签,加粗文本:,

  (9)斜体标签,是文本以斜体显示:em,

  (10)字体标签:font

  (11)居中标签:,使内容居中:

  5.表格:table

  (1)属性::边框大小。

  width:表格宽度。

  :表格的高度。

  align:表格在浏览器的位置。

  :设置表格边框线和单元格之间的距离。

  :设置单元格和单元格的距离。

  (2)子标签

  :表格的标题标签。

  tr:行标签。

  td:单元格。

  th:表头标签:自动居中并且适当加粗。

  (3)单元格的合并:

  合并行::占了几个单元格。

  合并列::占了几个单元格。

  6.表单标签form

  (1)表单:整个表单是块级标签,表单中每个元素是等级标签。

  (2)属性:

  : url 本地地址/后台地址。

  :常用的提交方式get/post。

  (3)应用场景:

  1)注册

  用户填写基本信息,前台校验,提交到后台的地址。

  后台查询当前用户是否存在,如果不存在用户才能注册。

  2)登录

  输入用户名和密码,在后台查询数据库中是否存在这个用户名和密 码存在,才可以登录;没有注册,先要注册。

  (4)get方式和post方式的区别

  get方式:

  1)直接将数据提交到url地址上。

  举例:后台地址?=&=123

  2)不适合提交隐私数据。

  3)由于是提交在地址栏上,它提交的数据大小有限制。

  post方式

  1)不会将用户数据提交在地址栏上,存在于请求头下面。

  实体内容:form data:=xxx&=

  提交方式:get/post提交密码数据需要使用MD5加密或 。

  2)相对于get方式,post更安全。

  3)它不是直接提交在地址栏上,提交的数据大小没有限制。

  (5)表单中的标签

  input标签

  标签 :下拉菜单

  子标签::下拉选项

  :文本域,书写文字描述

  7.input标签

  (1)属性:

  type:类型。

  value:输入框的默认值。

  :输入内容,自动获取焦点。

  登录/注册:表单项中必填的属性name。

  name属性:给系统后台写的内容css标题样式 JAVAWEB-前端HTML、CSS、JavaScript期末复习知识点总结,提交数据的名称(标记)。

  (2)type属性的值:

  text

  文本输入框

  密码输入框

  hide

  隐藏域: 没有效果,可以携带数据。

  date

  日期组件

  radio

  单项按钮

  复选框

  file

  文件上传

  提交按钮

  reset

  重置按钮

  image

  图片按纽

  文本内容就是当前按钮的名称

  (3)注意事项:radio和css标题样式,同一组类型信息css标题样式,指定相同的name属性 值。

  举例:="" 选中的状态。

  8.图像标签:img

  (1)属性:

  src :连接到图片资源地址 。

  width:指定图片的宽度。

  :指定图片的高度。

  单位:指定像素px。

  指定百分比:占当前50%,宽度和高度占整个分辨率的百分比。

  title:当鼠标悬浮图片上的提示文字

  alt:替换文本图片资源失效的时候,起作用。

  (2)注意:

  1)如果一个html页面中有3个图片(网络图片),请求某个服务器,会发 送4次请求。

  2)请求页面域名:端口号/当前html资源文件地址。

  3)每一个图片src加载都会发送一次请求。

  9.超链接:a标签

  (1)属性:

  href属性:跳转到资源地址

  属性:不指定,默认当前窗口直接打开地址。

  :新建窗口打开资源文件。

  _self(默认值):当前窗口直接打开。

  (2)资源地址:本地资源地址、网络资源地址、指定的服务器地址。

  (3)协议:

  超文本传输协议

  ://:迅雷协议

  如果本地有客户端软件,直接打开迅雷软件,没有跳转下载。

   :邮件协议

  (4)http协议的执行流程:

  在C:\\etchosts文件

  hosts文件记录了本地网站域名以及ip地址::127.0.0.1

  (5)如果hosts文件有访问的域名,并且对应ip,直接本地打开文件。

  如果找不到,调用网卡来联网操作----DNS服务器(网络运营商)。

  (6)超链接的应用场景: 1)连接到:网络资源地址/本地资源地址。 2)锚链接来使用

  在同一个html页面的使用

  a)打锚点: 定义一个标记位置

  b)创建一个跳转链接

  不同html页面的使用

  a)在另一个页面的某个位置打锚点: 定义一个标记位置。

  b)在当前页面上创建跳转标记

  10.标签:框架集标签

  (1)框架集:框架集与标签不共存。页面要么不用框架集,要用框架集, 整个页面必须全用。

  (2)作用:用于将页面划分几个模块来布局.

  (3)优点:方便布局.

  (4)缺点:加载速度慢;灵活性差.

  (5)标签:

  :可以整合多个页面与一个页面中。如果一个xxx系统由很多 html页面组成,那么可以使用框架集标签。

  frame:一个frame中包含一个html页面。

  (6)属性:

  rows:设置上下页面关系的权重(占整个框架集的百分比);

  cols:设置左右页面关系的权重(占整个框架集的百分比);

  11.内联框架

  (1)作用:可以在页面上任意地方引入其他页面。

  (2)优点:灵活性高.

  (3)举例:

  

  12.特殊符号

  含义

  符号

  小于号

  </p
p大于号/p
p>

  与字符

  &

  引号

  "

  己注册

  ®

  版权

  ©

  商标

  ™

  空格

  13.元素(标签)的分类

  (1)分类:块状元素、行内元素、内联块状元素

  (2)块状元素:独自占据一行的元素

  1)html中的块状元素

  、

  、、、

  专栏目录

  文章来源:https://blog.csdn.net/m0_57006708/article/details/121598161