当前位置: 首页 > 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…...

【GitHub项目推荐--Godogen:一句话生成完整 Godot 游戏的 AI 流水线】⭐⭐⭐

简介 Godogen​ 是一套基于 Claude Code​ 构建的自动化游戏开发流水线。它不仅仅是一个代码生成器&#xff0c;更是一个全栈的“AI 开发团队”&#xff1a;你只需用自然语言描述游戏创意&#xff0c;它便能自动完成架构设计、美术生成、代码编写、引擎截图、视觉质检的全流程…...

数据库索引原理:B+树与哈希索引的深度对决

数据库索引原理&#xff1a;B树与哈希索引的深度对决在数据库的世界里&#xff0c;索引是提升查询性能的“核武器”。如果把数据库表比作一本厚厚的书&#xff0c;那么索引就是书中的目录。没有目录&#xff0c;想要找到特定的知识点只能一页页翻找&#xff08;全表扫描&#x…...

Windows系统维护新体验:告别繁琐手动操作,用WinUtil一键搞定所有

Windows系统维护新体验&#xff1a;告别繁琐手动操作&#xff0c;用WinUtil一键搞定所有 【免费下载链接】winutil Chris Titus Techs Windows Utility - Install Programs, Tweaks, Fixes, and Updates 项目地址: https://gitcode.com/GitHub_Trending/wi/winutil 你是…...

AI五金冲压报价——让精准报价,快人一步。

传统报价熬3天&#xff1f;AI 8分钟给你一份带Excel明细正规PDF的报价单&#xff01;还在用Excel手动算冲压报价&#xff1f;客户催得急&#xff0c;成本核不准&#xff0c;格式不专业丢订单&#xff1f;五金厂的报价痛点&#xff0c;我们懂&#xff01;✅ 工艺PDF/3D图扔进去&…...

高效掌握多步提示工程:进阶AI任务处理的系统方法论

高效掌握多步提示工程&#xff1a;进阶AI任务处理的系统方法论 【免费下载链接】LangGPT LangGPT: Empowering everyone to become a prompt expert! &#x1f680; &#x1f4cc; 结构化提示词&#xff08;Structured Prompt&#xff09;提出者 &#x1f4cc; 元提示词&#x…...

程序员副业变现全攻略

CSDN程序员副业图谱技术文章大纲副业方向分类技术变现类&#xff1a;外包开发、技术咨询、代码审核内容创作类&#xff1a;技术博客、视频教程、电子书编写产品开发类&#xff1a;独立应用、开源项目、插件工具教育培训类&#xff1a;在线课程、一对一辅导、技术直播技术栈与工…...

ai赋能centos7开发,用快马平台智能生成优化配置和部署流水线

最近在折腾CentOS7的开发环境配置&#xff0c;发现手动搭建Python/Java环境、调试服务编排特别耗时。后来尝试用InsCode(快马)平台的AI辅助功能&#xff0c;效率直接翻倍。分享下我的实践过程&#xff1a; 环境配置方案生成 输入"CentOS7 Python3.9Java11开发环境"后…...

从零开始:使用ecCodes库高效解析GRIB文件

1. 为什么需要ecCodes库处理GRIB文件 第一次接触气象数据时&#xff0c;我被GRIB文件搞得一头雾水。这种二进制格式就像个黑盒子&#xff0c;明明知道里面装着宝贵的温度、气压、风速数据&#xff0c;却不知道怎么取出来。后来发现ecCodes库就像开罐器&#xff0c;能轻松打开这…...

RWKV7-1.5B-g1a参数调优教程:temperature=0.1稳输出 vs 0.8活生成,效果差异实测

RWKV7-1.5B-g1a参数调优教程&#xff1a;temperature0.1稳输出 vs 0.8活生成&#xff0c;效果差异实测 1. 模型简介 rwkv7-1.5B-g1a是基于RWKV-7架构的多语言文本生成模型&#xff0c;特别适合以下场景&#xff1a; 基础问答文案续写简短总结轻量中文对话 这个1.5B参数的版…...

新手如何借助快马平台AI生成代码,轻松入门蓝桥杯经典题型

作为一个刚接触编程的新手&#xff0c;参加蓝桥杯这样的比赛可能会觉得无从下手。特别是看到题目要求实现算法时&#xff0c;往往不知道如何把问题拆解成代码。最近我发现用InsCode(快马)平台可以很好地解决这个问题&#xff0c;它能根据题目描述直接生成可运行的代码&#xff…...