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

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

<!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;繁体中文、港澳台等方式…...

01_深度学习基础知识

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

60、最大公约数

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

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

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

imx6ull - 制作烧录SD卡

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

使用chatgpt api快速分析pdf

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

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/…...

【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;基本上…...

汽车区域控制器技术分析

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

myEclipse新手使用教程

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

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

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

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

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

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

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

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

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

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"…...

FlyMcu串口下载STLINK Utility

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

CSS(盒子模型,定位,浮动,扩展)

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

AIGC如何改变人类生活20240529

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

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

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

若依 Spring Security 短信,扫码登录

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

TDengine 快速体验(Docker 镜像方式)

简介 TDengine 可以通过安装包、Docker 镜像 及云服务快速体验 TDengine 的功能&#xff0c;本节首先介绍如何通过 Docker 快速体验 TDengine&#xff0c;然后介绍如何在 Docker 环境下体验 TDengine 的写入和查询功能。如果你不熟悉 Docker&#xff0c;请使用 安装包的方式快…...

CTF show Web 红包题第六弹

提示 1.不是SQL注入 2.需要找关键源码 思路 进入页面发现是一个登录框&#xff0c;很难让人不联想到SQL注入&#xff0c;但提示都说了不是SQL注入&#xff0c;所以就不往这方面想了 ​ 先查看一下网页源码&#xff0c;发现一段JavaScript代码&#xff0c;有一个关键类ctfs…...

Python爬虫实战:研究feedparser库相关技术

1. 引言 1.1 研究背景与意义 在当今信息爆炸的时代,互联网上存在着海量的信息资源。RSS(Really Simple Syndication)作为一种标准化的信息聚合技术,被广泛用于网站内容的发布和订阅。通过 RSS,用户可以方便地获取网站更新的内容,而无需频繁访问各个网站。 然而,互联网…...

MODBUS TCP转CANopen 技术赋能高效协同作业

在现代工业自动化领域&#xff0c;MODBUS TCP和CANopen两种通讯协议因其稳定性和高效性被广泛应用于各种设备和系统中。而随着科技的不断进步&#xff0c;这两种通讯协议也正在被逐步融合&#xff0c;形成了一种新型的通讯方式——开疆智能MODBUS TCP转CANopen网关KJ-TCPC-CANP…...

嵌入式学习笔记DAY33(网络编程——TCP)

一、网络架构 C/S &#xff08;client/server 客户端/服务器&#xff09;&#xff1a;由客户端和服务器端两个部分组成。客户端通常是用户使用的应用程序&#xff0c;负责提供用户界面和交互逻辑 &#xff0c;接收用户输入&#xff0c;向服务器发送请求&#xff0c;并展示服务…...

【Go语言基础【12】】指针:声明、取地址、解引用

文章目录 零、概述&#xff1a;指针 vs. 引用&#xff08;类比其他语言&#xff09;一、指针基础概念二、指针声明与初始化三、指针操作符1. &&#xff1a;取地址&#xff08;拿到内存地址&#xff09;2. *&#xff1a;解引用&#xff08;拿到值&#xff09; 四、空指针&am…...

人工智能(大型语言模型 LLMs)对不同学科的影响以及由此产生的新学习方式

今天是关于AI如何在教学中增强学生的学习体验&#xff0c;我把重要信息标红了。人文学科的价值被低估了 ⬇️ 转型与必要性 人工智能正在深刻地改变教育&#xff0c;这并非炒作&#xff0c;而是已经发生的巨大变革。教育机构和教育者不能忽视它&#xff0c;试图简单地禁止学生使…...

毫米波雷达基础理论(3D+4D)

3D、4D毫米波雷达基础知识及厂商选型 PreView : https://mp.weixin.qq.com/s/bQkju4r6med7I3TBGJI_bQ 1. FMCW毫米波雷达基础知识 主要参考博文&#xff1a; 一文入门汽车毫米波雷达基本原理 &#xff1a;https://mp.weixin.qq.com/s/_EN7A5lKcz2Eh8dLnjE19w 毫米波雷达基础…...

comfyui 工作流中 图生视频 如何增加视频的长度到5秒

comfyUI 工作流怎么可以生成更长的视频。除了硬件显存要求之外还有别的方法吗&#xff1f; 在ComfyUI中实现图生视频并延长到5秒&#xff0c;需要结合多个扩展和技巧。以下是完整解决方案&#xff1a; 核心工作流配置&#xff08;24fps下5秒120帧&#xff09; #mermaid-svg-yP…...

AD学习(3)

1 PCB封装元素组成及简单的PCB封装创建 封装的组成部分&#xff1a; &#xff08;1&#xff09;PCB焊盘&#xff1a;表层的铜 &#xff0c;top层的铜 &#xff08;2&#xff09;管脚序号&#xff1a;用来关联原理图中的管脚的序号&#xff0c;原理图的序号需要和PCB封装一一…...