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

Java Web学习笔记5——基础标签和样式

news 2025/9/16 20:49:17

<!DOCTYPE html>

html有很多版本，那我们应该告诉用户和浏览器我们现在使用的是HMTL哪个版本。

声明为HTML5文档。

字符集：

UTF-8：现在最常用的字符编码方式。

GB2312：简体中文

BIG5：繁体中文、港澳台等方式；

GBK：全部中文字符：是GB2312的扩展，加入对繁体字的支持，兼容GB2312  （国标的扩展）

记住：以后，我们统一使用UTF-8字符集，这样就避免出现字符集不统一而引起的乱码的情况。

图片标签：<img>

src: 指定图像的URL（绝对路径/相对路径）

绝对路径：

绝对磁盘路径

绝对网络路径

相对路径：

./  当前路径  ./可以省略

../ 上一级目录

修改好文件，要注意保存。

width：图像的宽度（像素px/相对于父元素的百分比）

height：图像的高度（像素px/相对于父元素的百分比）

标题标签：<h1>...<h6>

水平分割线：<hr>

<!-- 文档类型为HTML -->
<!DOCTYPE html>
<html lang="en">
<head><!-- 字符集为UTF-8 --><meta charset="UTF-8"><!-- 设置浏览器的兼容性 --><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>焦点访谈：中国底气 新思想夯实大国粮仓</title>
</head>
<body><img src="img/news_logo.png"> 新浪政务 > 正文<h1>焦点访谈：中国底气 新思想夯实大国粮仓</h1><hr>2024年6月4日 21:50 央视网<hr>
</body>
</html>

CSS的引入方式：

1）行内样式：写在标签的style属性中（不推荐）

<h1 style="XXX: XXX; XXX: XXX;">中国新闻网</h1>

属性名：属性值

2）内嵌样式：写在style标签中（可以写在页面的任何位置，但通常约定写在head

中）

<style>

h1 {

XXX: XXX;

XXX: XXX;

}

</style>

3）外联样式：写在一个单独的.css文件中（但需要通过link标签在网页中引入）。

h1 {

XXX: XXX;

XXX: XXX;

}

<!-- 文档类型为HTML -->
<!DOCTYPE html>
<html lang="en">
<head><!-- 字符集为UTF-8 --><meta charset="UTF-8"><!-- 设置浏览器的兼容性 --><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>焦点访谈：中国底气 新思想夯实大国粮仓</title><!-- 方式二：内嵌样式 --><style>h1 {color: red;}</style><!-- <link rel="stylesheet" href="css/news.css"> -->
</head>
<body><img src="img/news_logo.png"> 新浪政务 > 正文<!-- 方式一：行内的样式 不推荐<h1 style="color: red;">焦点访谈：中国底气 新思想夯实大国粮仓</h1> --><h1>焦点访谈：中国底气 新思想夯实大国粮仓</h1><hr>2024年6月4日 21:50 央视网<hr>
</body>
</html>

颜色表示方法：

相关文章：

Java Web学习笔记5——基础标签和样式

<!DOCTYPE html> html有很多版本&#xff0c;那我们应该告诉用户和浏览器我们现在使用的是HMTL哪个版本。 声明为HTML5文档。 字符集&#xff1a; UTF-8&#xff1a;现在最常用的字符编码方式。 GB2312&#xff1a;简体中文 BIG5&#xff1a;繁体中文、港澳台等方式…...

编程日记 2024/6/5 7:49:39

01_深度学习基础知识

1. 感知机 感知机通常情况下指单层的人工神经网络，其结构与 MP 模型类似（按照生物神经元的结构和工作原理造出来的一个抽象和简化了模型，也称为神经网络的一个处理单元） 假设由一个 n 维的单层感知机，则： x 1 x_1 x1​ 至 x n x_n xn​ 为 n 维输入向量的各个分量w 1 j…...

编程日记 2024/6/5 7:48:38

60、最大公约数

最大公约数 题目描述 给定n对正整数ai,bi&#xff0c;请你求出每对数的最大公约数。 输入格式 第一行包含整数n。 接下来n行&#xff0c;每行包含一个整数对ai,bi。 输出格式 输出共n行&#xff0c;每行输出一个整数对的最大公约数。 数据范围 1 ≤ n ≤ 1 0 5 , 1≤n≤…...

编程日记 2024/6/5 7:47:37

设计模式在芯片验证中的应用——迭代器

一、迭代器设计模式 迭代器设计模式(iterator)是一种行为设计模式&#xff0c; 让你能在不暴露集合底层表现形式 &#xff08;列表、 栈和树等数据结构&#xff09; 的情况下遍历集合中所有的元素。 在验证环境中的checker会收集各个monitor上送过来的transactions&#xff0…...

编程日记 2024/6/5 7:45:36

imx6ull - 制作烧录SD卡

1、参考NXP官方的手册《i.MX_Linux_Users_Guide.pdf》的这一章节&#xff1a; 1、SD卡分区 提示&#xff1a;我们常用的SD卡一个扇区的大小是512字节。 先说一下i.MX6ULL使用SD卡启动时的分区情况&#xff0c;NXP官方给的镜像布局结构如下所示&#xff1a; 可以看到&#xff0c…...

编程日记 2024/6/5 7:40:31

使用chatgpt api快速分析pdf

需求背景 搞材料的兄弟经常要分析pdf&#xff0c;然后看到国外有产品是专门调用chatpdf来分析pdf的&#xff0c;所以就来问我能不能帮他也做一个出来。正好我有chatgpt的api&#xff0c;所以就研究了一下这玩意怎么弄。 需求分析 由于chatgpt是按字符算钱的&#xff0c;所以…...

编程日记 2024/6/5 7:37:29

Vue：状态管理pinia

安装 npm install pinia在 main.js 中注册 // main.jsimport { createApp } from vue import { createPinia } from "pinia"; import App from ./app.vueconst app createApp(App) const pinia createPinia(); app.use(pinia).mount(#app)创建 store // stores/…...

编程日记 2024/6/5 7:36:28

【Android Studio】导入import android.support.v7.app.AppcompatActivity；时报错

一、问题描述 在进行安卓项目开发时使用import android.support.v7.app.AppcompatActivity;报错&#xff1a; 运行后会有乱码出现&#xff1a; 二、解决办法 将import android.support.v7.app.AppcompatActivity;改为import androidx.appcompat.app.AppCompatActivity;基本上…...

编程日记 2024/6/5 7:34:26

汽车区域控制器技术分析

汽车区域控制器的起源与发展 随着汽车技术的不断发展，汽车电子电气架构也在经历着深刻的变革。汽车区域控制器作为一种新兴的技术，正逐渐成为汽车电子电气架构的重要组成部分。 在早期，汽车电子电气架构主要采用分布式架构。这种架构下，各个电子控制单元（ECU）分别负责不…...

编程日记 2024/6/5 7:33:25

myEclipse新手使用教程

myEclipse新手使用教程 一、引言 myEclipse是一款流行的Java集成开发环境&#xff08;IDE&#xff09;&#xff0c;它集成了众多的开发工具&#xff0c;为Java开发者提供了一个强大的开发平台。本文将详细介绍如何下载、安装和配置myEclipse&#xff0c;以及如何创建一个简单…...

编程日记 2024/6/5 7:31:22

【WPF编程宝典】第6讲：资源

研究了 WPF 资源系统使得在应用不同部分可以重用相同对象的原理&#xff0c;介绍了如何在代 码和标记中声明资源&#xff0c;如何提取系统资源&#xff0c;以及如何使用类库程序集在应用程序之间共享资源。 1.资源基础 1.1静态资源和动态资源 区别&#xff1a;静态资源只从资…...

编程日记 2024/6/5 7:30:21

容器化部署Pig微服务快速开发框架

系统说明 基于 Spring Cloud 、Spring Boot、 OAuth2 的 RBAC 企业快速开发平台&#xff0c; 同时支持微服务架构和单体架构 提供对 Spring Authorization Server 生产级实践&#xff0c;支持多种安全授权模式 提供对常见容器化方案支持 Kubernetes、Rancher2 、Kubesphere、E…...

编程日记 2024/6/5 7:26:16

Windows编程：图标资源、光标资源、字符串资源、加速键资源、WM_PAINT消息、绘图

承接前文&#xff1a; win32窗口编程windows 开发基础win32-注册窗口类、创建窗口win32-显示窗口、消息循环、消息队列win32-鼠标消息、键盘消息、计时器消息、菜单资源 本文目录 图标资源光标资源WM_SETCURSOR 消息 字符串资源加速键资源WM_PAINT 消息绘图绘图编程绘图基础基…...

编程日记 2024/6/5 7:25:14

【2024 短剧0元轻资产创业风口】做自己的老板，做新媒体的领路人

好省短剧邀请码2Urux1ZoQm(长按复制粘贴即可)大多数好省短剧推广活动都会通过官方渠道发布邀请码。您可以通过关注官方社交媒体账号、订阅电子邮件通知或参与官方网站上的活动，获得邀请码的机会。官方渠道通常会提前公布邀请码的获取方式和条件，您只需按照要求执行即可。好省…...

编程日记 2024/6/5 7:24:13

Docker安装Bitbucket

centos7版本 [rootlocalhost ~]# cat /etc/os-release NAME"CentOS Linux" VERSION"7 (Core)" ID"centos" ID_LIKE"rhel fedora" VERSION_ID"7" PRETTY_NAME"CentOS Linux 7 (Core)" ANSI_COLOR"0;31"…...

编程日记 2024/6/5 7:21:10

FlyMcu串口下载STLINK Utility

一、FlyMcu程序烧录软件 1、可以通过串口给STM32下载程序&#xff0c;如果没有STLINK&#xff0c;就可以用这个软件通过串口下载程序&#xff0c;和STC的51单片机的烧录软件STC-ISP一样&#xff0c;通过串口给单片机下载程序 2、创建串口下载所需要的HEX文件 3、选择串口和波…...

编程日记 2024/6/5 7:20:07

CSS（盒子模型，定位，浮动，扩展）

CSS 盒子模型&#xff1a;外边距&#xff1a;内边距&#xff1a;水平居中&#xff1a; 定位&#xff1a;相对定位&#xff1a;绝对定位&#xff1a;固定定位&#xff1a; 浮动&#xff1a;扩展&#xff1a; 盒子模型&#xff1a; 盒子模型(Box Model) 规定了元素框处理元素内容…...

编程日记 2024/6/5 7:19:06

AIGC如何改变人类生活20240529

AIGC如何改变人类生活 随着人工智能技术的不断发展&#xff0c;人类生活正经历着前所未有的变革。在这个过程中&#xff0c;AIGC&#xff08;人工智能生成内容&#xff09;的概念应运而生&#xff0c;它已经在很多领域产生了深远的影响。本文将探讨AIGC如何改变人类生活&#…...

编程日记 2024/6/5 7:18:05

【python】成功解决“TypeError: ‘method’ object is not subscriptable”错误的全面指南

成功解决“TypeError: ‘method’ object is not subscriptable”错误的全面指南 一、引言 在Python编程中&#xff0c;TypeError: method object is not subscriptable错误是一个常见的陷阱&#xff0c;特别是对于初学者来说。这个错误通常意味着你尝试像访问列表、元组、字典…...

编程日记 2024/6/5 7:17:04

若依 Spring Security 短信，扫码登录

1. 修改 LoginBody&#xff0c;添加登录类型字段 Data public class LoginBody {/*** 用户名*/private String username;/*** 用户密码*/private String password;/*** 验证码*/private String code;/*** 唯一标识*/private String uuid;/*** 登录类型*/private String logi…...

编程日记 2024/6/5 7:14:00

浅谈 React Hooks

React Hooks 是 React 16.8 引入的一组 API&#xff0c;用于在函数组件中使用 state 和其他 React 特性&#xff08;例如生命周期方法、context 等&#xff09;。Hooks 通过简洁的函数接口&#xff0c;解决了状态与 UI 的高度解耦&#xff0c;通过函数式编程范式实现更灵活 Rea…...

编程新知 2025/7/7 6:59:35

12.找到字符串中所有字母异位词

&#x1f9e0; 题目解析 题目描述&#xff1a; 给定两个字符串 s 和 p&#xff0c;找出 s 中所有 p 的字母异位词的起始索引。 返回的答案以数组形式表示。 字母异位词定义&#xff1a; 若两个字符串包含的字符种类和出现次数完全相同&#xff0c;顺序无所谓&#xff0c;则互为…...

编程新知 2025/9/12 13:41:18

JVM暂停（Stop-The-World，STW）的原因分类及对应排查方案

JVM暂停（Stop-The-World，STW）的完整原因分类及对应排查方案，结合JVM运行机制和常见故障场景整理而成： 一、GC相关暂停​​ 1. ​​安全点（Safepoint）阻塞​​ ​​现象​​：JVM暂停但无GC日志，日志显示No GCs detected。​​原因​​：JVM等待所有线程进入安全点（如…...

编程新知 2025/8/25 19:36:37

Springboot社区养老保险系统小程序

一、前言 随着我国经济迅速发展&#xff0c;人们对手机的需求越来越大&#xff0c;各种手机软件也都在被广泛应用&#xff0c;但是对于手机进行数据信息管理&#xff0c;对于手机的各种软件也是备受用户的喜爱&#xff0c;社区养老保险系统小程序被用户普遍使用&#xff0c;为方…...

编程新知 2025/9/9 10:09:41

Angular微前端架构：Module Federation + ngx-build-plus (Webpack)

以下是一个完整的 Angular 微前端示例&#xff0c;其中使用的是 Module Federation 和 npx-build-plus 实现了主应用&#xff08;Shell&#xff09;与子应用&#xff08;Remote&#xff09;的集成。 &#x1f6e0;️ 项目结构 angular-mf/ ├── shell-app/ # 主应用&…...

编程新知 2025/6/15 10:41:11

sipsak：SIP瑞士军刀！全参数详细教程！Kali Linux教程！

简介 sipsak 是一个面向会话初始协议 (SIP) 应用程序开发人员和管理员的小型命令行工具。它可以用于对 SIP 应用程序和设备进行一些简单的测试。 sipsak 是一款 SIP 压力和诊断实用程序。它通过 sip-uri 向服务器发送 SIP 请求&#xff0c;并检查收到的响应。它以以下模式之一…...

编程新知 2025/9/13 17:37:48

智能AI电话机器人系统的识别能力现状与发展水平

一、引言 随着人工智能技术的飞速发展&#xff0c;AI电话机器人系统已经从简单的自动应答工具演变为具备复杂交互能力的智能助手。这类系统结合了语音识别、自然语言处理、情感计算和机器学习等多项前沿技术&#xff0c;在客户服务、营销推广、信息查询等领域发挥着越来越重要…...

编程新知 2025/6/11 3:05:02

C++：多态机制详解

目录 一. 多态的概念 1.静态多态&#xff08;编译时多态&#xff09; 二.动态多态的定义及实现 1.多态的构成条件 2.虚函数 3.虚函数的重写/覆盖 4.虚函数重写的一些其他问题 1&#xff09;.协变 2&#xff09;.析构函数的重写 5.override 和 final关键字 1&#…...

编程新知 2025/9/7 8:55:13

排序算法总结（C++）

目录 一、稳定性二、排序算法选择、冒泡、插入排序归并排序随机快速排序堆排序基数排序计数排序 三、总结 一、稳定性 排序算法的稳定性是指&#xff1a;同样大小的样本 **&#xff08;同样大小的数据&#xff09;**在排序之后不会改变原始的相对次序。 稳定性对基础类型对象…...

编程新知 2025/9/14 0:25:25

现有的 Redis 分布式锁库（如 Redisson）提供了哪些便利？

现有的 Redis 分布式锁库&#xff08;如 Redisson&#xff09;相比于开发者自己基于 Redis 命令&#xff08;如 SETNX, EXPIRE, DEL&#xff09;手动实现分布式锁&#xff0c;提供了巨大的便利性和健壮性。主要体现在以下几个方面&#xff1a; 原子性保证 (Atomicity)&#xff…...

编程新知 2025/9/2 18:15:10