黑马JavaWeb开发笔记01——前端介绍,HTML实现标题:排版

文章目录

  • 前言
  • 一、认识web前端、HTML、CSS
  • 二、VS Code开发工具(插件弃用问题)
  • 三、HTML结构标签介绍
    • 1. 标签页标题< title >
    • 2. 图片标签< img >
      • 1) 常见属性
      • 2) src路径书写方式
    • 3. 标题标签< h >
    • 4. 水平分页线标签< hr >
  • 四、用Vscode实现标题排版
    • 1. 创建文件
    • 2. 初始化一下html文件
    • 3. 仿照新浪新闻元素编写标签
  • 五、完整源码和实现效果
  • 总结


前言

本篇文章是2023年最新黑马JavaWeb开发笔记01:前端介绍html实现标题排版内容的总结,帮助需要学习Web开发的朋友温故而知新。

本系列笔记不会像韩顺平老师Java课程专栏笔记那么细致,主要是以展示知识点和基本语法和使用方法为主,作为本人以及各位朋友在Web开发过程中的一份“API文档”使用,语言会更言简意赅,目录会做得更细分,帮助大家在遗忘某个知识点时能够迅速准确回忆知识。

  1. 认识web前端、HTML、CSS
  2. VS Code开发工具(插件弃用问题)
  3. HTML结构标签介绍
  4. 用Vscode实现标题排版
  5. 完整源码和实现效果

一、认识web前端、HTML、CSS

  • Web标准也称为网页标准,由一系列的标准组成,大部分由W3C(World Wide Web Consortium, 万维网联盟)负责制定。
  • 三个组成部分;
    • HTML: 负责网页的结构(页面元素和内容)
    • CSS: 负责网页的表现(页面元素的外观、位置等页面样式,如:颜色、大小等)
    • JavaScript: 负责网页的行为(交互效果)
  • HTML: HyperText Markup Language,超文本标记语言。
    • 超文本:超越了文本的限制,比普通文本更强大。除了文字信息,还可以定义图片、音频、视频等内容。
    • 标记语言:由标签构成的语言
      • HTML标签都是预定义好的。例如:使用< h >标签展示标题,使用< a >展示超链接,使用< img >展示图片,用< video >展示视频。
      • HTML代码直接在浏览器中运行,HTML标签由浏览器解析。
  • CSS: Cascading Style Sheet,层叠样式表,用于控制页面的样式(表现)。

二、VS Code开发工具(插件弃用问题)

根据文档把VScode安装好,该下的插件下好

  • 第11个插件Beautify已经弃用,这里我下了另一个插件JS-Beautify
    黑马JavaWeb开发笔记01——前端介绍,HTML实现标题:排版_第1张图片
  • 第12个插件已经弃用,据提醒该功能已经被VsCode内置,无需单独下载
    黑马JavaWeb开发笔记01——前端介绍,HTML实现标题:排版_第2张图片

三、HTML结构标签介绍

  • 以下是HTML结构标签基本格式:< title >中定义标题显示在浏览器的标题位置,< body >中定义的内容会呈现在浏览器的内容区域
<html>
	<head>
		<title> title>
	head>
	<body>
	
	body>
html>
  • html的特点

    • 标签不区分大小写
      <

你可能感兴趣的:(前端,html,开发语言,笔记,软件工程,web,java)