Erlo

html总结

2023-03-10 00:30:26 发布   188 浏览  
页面报错/反馈
收藏 点赞


HTML&CSS:
    对Web标准的理解、浏览器内核差异、兼容性、hack、CSS基本功:布局、盒子模型、选择器优先级、
    HTML5、CSS3、Flexbox

JavaScript:
    数据类型、运算、对象、Function、继承、闭包、作用域、原型链、事件、RegExp、JSON、Ajax、
    DOM、BOM、内存泄漏、跨域、异步装载、模板引擎、前端MVC、路由、模块化、Canvas、ECMAScript 6、Nodejs

其他:
    移动端、响应式、自动化构建、HTTP、离线存储、WEB安全、优化、重构、团队协作、可维护、易用性、SEO、UED、架构、职业生涯、快速学习能力

html

标签于声明

声明为 HTML5 文档

元素是 HTML 页面的根元素

  • 头部

元素包含了文档的元(meta)数据,如 定义网页编码格式为 utf-8

charset 常用的值有:GB2312、BIG5、GBK 和 UTF-8,其中 UTF-8 被称为万国码,基本包含了全世界所有国家需要用到的字符

元素描述了文档的标题

用户可以看到的标签

元素包含了可见的页面内容

lang语言种类

用来定义当前文档显示的语言

  • en定义语言为英语
  • zh-CN定义语言为中文

二、标签

2.1、标题标签

h1——h6

  • 加了标题的文字会变的加粗,字号也会以此变大
  • 一个标题独占一行

2.2、段落标签

  • 文本在一个段落这种会根据浏览器窗口的大小进行自动换行
  • 段落和段落之间保有空隙

段落标签

2.3、换行标签


  • >(
    >
    )是个单标签

  • 标签只是简单的开始新的一行,跟段落不一样,段落之间会插入一些垂直的间距

2.4、文本格式标签

为文字设置粗细、斜体、下划线等效果

语义 标签
加粗
倾斜
删除线
下划线

2.5、媒体标签

2.5.1、图片标签是单标签

代码:


场景:在网页显示图片

属性名:src

  • 图片的url路径

属性名:alt

属性值:替换文本

  • 当图片加载失败时,才显示alt文本
  • 当图片加载成功时,不会显示alt文本

属性名:title

属性值:提示文本

  • 当鼠标悬停时,才显示的文本

2.5.2、路径

2.5.3音频标签


属性:controls

属性:muted

  • 禁音

2.5.4、视频标签


2.6、链接标签


2.盒子标签

:一行只能放一个大盒子

表格

标记 说明
table 表格标记
caption 表格标题标记
th 表格表头标记
tr 表格的行标记
td 表格的列标记
theaad 定义表格的表头
tbody 定义表格的主体
tfoot 定义表格的页脚

表格空间

属性:cellspacing

定义表格单元格之间的空间

属性:cellpadding

表示单元格边框与单元格内容之间的距离

合并单元格

属性:colspan

  • 如果要将两个或多个列合并为一个列

属性:rowspan

  • 如果要合并两行或更多行

表单

HTML 表单用于收集不同类型的用户输入。

form表单域

基本语法

属性名:action

属性值如下:

  • 指定处理表单信息的服务器端(相当于数据要传输的地方)

属性名:method

属性值如下:

  1. 指定向服务器发送数据的方法,get、post,默认get

  2. 两种提交方式的区别:

    • get:地址栏状态会发生变化,表单数据会在url信息中展示。
    • post:不会改变地址栏状态,表单数据不会被显示

    post方式提交的数据安全性要明显高于get方式提交数据。

属性名:enctype

属性值如下:

规定表单数据在发送到服务器之前进行编码。有三种

  1. application/x-www-form-urlencoded(在发送前编码所有字符,默认)
  2. multipart/form-data(不对字符编码,文件上传时必须使用此值)

input标签

基本语法:



属性名:type

属性值如下:

  1. text:单行文本输入框

  2. password:密码输入框

  3. checkbox:复选框

        
    1 2 3

image-20230309232935885

  1. radio:单选按钮
 
1 2 3

image-20230309232800143

  1. image:图像按钮
  2. submit:提交按钮
  3. reset:重置按钮
  4. button:普通按钮
  5. file:文件选择框
    
上传文件

image-20230309233308178

  1. hidden:隐藏框

属性名:name

下拉表单元素

属性:select

选择时间为 

image-20230309235154467

optgrou标签分组

属性名:label

属性值:表示分组名

 

image-20230309235421044

文本域

 
     

image-20230309235100649

通过textarea> 标签可以轻松地创建多行文本输入框。
cols=“每行中的字符数”,rows=“显示的行数”,我们在实际开发中不会使用,都是用CSS 来改变大小。
readonly="readonly":设置为只读模式,不允许编辑。
disable="disable":设置禁用文本域

登录查看全部

参与评论

评论留言

还没有评论留言,赶紧来抢楼吧~~

手机查看

返回顶部

给这篇文章打个标签吧~

棒极了 糟糕透顶 好文章 PHP JAVA JS 小程序 Python SEO MySql 确认