当前位置: 首页 > news >正文

入门四认识HTML

目录

一、HTML介绍

1、Web前端三大核心技术 

2、什么是HTML 

3、Html标签

4、标签属性 

二、HTML骨架标签

三、编写HTML工具

四、常用标签 

1、注释 

2、标题标签 

3、段落标签 

4、超链接标签

5、图片标签

6、换行与空格 

7、布局标签 

8、列表标签 

9、表单标签 

五、总结 


一、HTML介绍

1、Web前端三大核心技术 

HTML:负责网页的架构

CSS:负责网页的样式、美化

JS:负责网页的行动

2、什么是HTML 

HTML是用来描述网页的一种语言。

3、Html标签

单标签<html>

双标签<h>内容</h> 

4、标签属性 

属性格式:属性名=“属性值” <a href="http://www.jd.com">京东</a> 

二、HTML骨架标签

html:根标签 ,所有的内容都应该放到html标签中

head:头部标签

body:身体标签(代码编写区域)

 

三、编写HTML工具

四、常用标签 

1、注释 

作用:描述的内容不会被浏览器执行

说明:解释代码的含义给程序员看。

国际通用快捷键:Ctrl+/  <!-- 注释区域 -->

 测试点:前端页面发布上线之前,需要检查(描述不恰当的文字出现)所有注释或去除注释。

2、标题标签 

说明:HMTL标题是 通过<h1>—<h6>等标签进行定义

示例:

 

3、段落标签 

说明:HTML段落是通过<p>标签进行定义的

 示例:

4、超链接标签

说明:超链接是通过<a>标签进行定义的,点击文本跳转指定页面

示例:​​​​​​​

属性:href:跳转地址                target:新窗口打开 

5、图片标签

说明:网页中插入图片就要使用图片标签,HTML图片是通过<img>标签进行定义的

测试点:必须有title属性(悬停和未加载显示)

示例:

属性:

        src:图片路径         title:光标悬停显示文字          alt:图片未加载时显示文字

        width:图片宽度        height:图片高度

6、换行与空格 

换行:<br/>        空格:%nbsp;

示例:

 

7、布局标签 

说明:设置页面布局,便于排版,常用(div+span)

示例:

8、列表标签 

说明:列表标签常用 li 元素(分为:有序和无序)

示例:

 style:js标签        script:js标签        link:外部加载css标签

9、表单标签 

说明:页面提交输入信息需要使用表单标签<from> 

按钮测试点:通用使用value进行赋值

属性:

        文本框:<input type="text" />

        密码框:<input type="password" />

        单选框:<input type="radio" name="1" />男    <input type="radio" name="1"/>女

        复选框:<input type="checkbox" />

        提交按钮:<input type="submit"/>

        清空按钮: <input type="reset"/>

        普通按钮:<input type="button"/>

示例:

五、总结 

http://www.lryc.cn/news/355807.html

相关文章:

  • js怎么生成验证码?js生成指定长度的随机字符串
  • Python魔法之旅-魔法方法(01)
  • 介绍下 npm 模块安装机制,为什么输入 npm install 就可以自动安装对应的模块
  • vue2如何父组件 对象 双向绑定子组件
  • [Android]在后台线程执行耗时操作,然后在主线程更新UI
  • 平方回文数-第13届蓝桥杯选拔赛Python真题精选
  • 位置编码(三) 2D旋转位置编码
  • 1、pikachu靶场之xss钓鱼复现
  • 弘君资本炒股技巧:股票定向增发是什么意思?是好是坏?
  • vue3项目使用pinia状态管理器----通俗易懂
  • 零基础学Java第二十五天之Lambda表达式
  • VSCode配置Lua5.4安装
  • CI/CD:持续集成/持续部署
  • ComfyUI工作流网站
  • 【机器学习】机器学习基础概念与初步探索
  • 学英语材料:单口喜剧、讲故事、短剧喜剧以及广播剧和播客节目
  • Docker Compose使用
  • 如何优雅的卸载linux上的todesk
  • 【Vue】el-checkbox多选框实现单选效果,选中一个选项则自动取消其他勾选
  • Linux中使用vi编辑器自动缩进4个字符
  • #笔记#笔记#其他
  • gtask笔记
  • 【Linux学习】深入探索进程等待与进程退出码和退出信号
  • Linux:线程
  • 卡到BUG了:删除重发白得积分(以前删除会扣减积分)
  • 轻松拿捏C语言——【字符函数】字符分类函数、字符转换函数
  • 【Rust日报】ratatui版本更新
  • 力扣每日一题 5/28
  • async函数和await函数
  • Redis面试题深度解析