HTML-JavaWeb
目录
1.标题排版
2.标题样式
编辑 编辑
小结
3.超链接
4.正文排版
编辑编辑编辑5.正文布局
6.表格标签
7.表单标签
8.表单项标签
1.标题排版
● 图片标签 :< img>
· src:指定图像的ur1(绝对路径/相对路径)
· width:图像的宽度(像素/相对于父元素的百分比)
· height:图像的高度(像素/相对于父元素的百分比)
● 标题标签 :< h1> -< h6>
● 水平线标签 :< hr>
1. 标题标签
● 标签 :< h1> ...< /h1>(h1→h6 重要程度依次降低)
● 注意:HTML标签都是预定义好的,不能自己随意定义。
2. 水平线标签 <hr>
3. 图片标签
<img src=" ... " width=" ... " height=" ... ">
● 绝对路径:绝对磁盘路径(D:/xxxx)、绝对网络路径(https://xxxx)
● 相对路径:从当前文件开始查找。(./:当前目录, .. /:上级目录)


2.标题样式




小结
1. <span>标签
●<span>是一个在开发网页时大量会用到的没有语义的布局标签
● 特点:一行可以显示多个(组合行内元素),宽度和高度默认由内容撑开
2. CSS选择器
● 元素选择器:标签名 { ... }
●id选择器:#id属性值 { ... }
● 类选择器 :. class属性值 { ... }
● 优先级:id选择器>类选择器>元素选择器
3. CSS属性
● color:设置文本的颜色
●font-size:字体大小 (注意:记得加px)
3.超链接
● 标签:
<a href=" ... "target=" ... ">央视网</a>
● 属性:
href:指定资源访问的url
target:指定在何处打开资源链接
_self:默认值,在当前页面打开
_blank:在空白页面打开


4.正文排版
● 视频标签 :< video>
src: 规定视频的url
· controls:显示播放控件
· width:播放器的宽度
· height:播放器的高度
● 音频标签 :< audio>
· src:规定音频的url
controls:显示播放控件
● 段落标签 :< p>
● 文本加粗标签 :< b>/<stroag>


5.正文布局

● 布局标签:实际开发网页中,会大量频繁的使用div和span这两个没有语义的布局标签。
● 标签 :< div> <span>
特点:
● div标签:
● 一行只显示一个(独占一行)
● 宽度默认是父元素的宽度,高度默认由内容撑开
● 可以设置宽高(width、height)
● span标签:
● 一行可以显示多个
● 宽度和高度默认由内容撑开
● 不可以设置宽高(width、height)
6.表格标签


7.表单标签
● 场景:在网页中主要负责数据采集功能,如注册、登录等数据采集。
● 标签 :< form>
● 表单项:不同类型的input元素、下拉列表、文本域等。
● <input>:定义表单项,通过type属性控制输入形式
● <select>:定义下拉列表
● <textarea>:定义文本域
属性:
● action:规定当提交表单时向何处发送表单数据,URL
● method:规定用于发送表单数据的方式。GET、POST



8.表单项标签
<input>:表单项,通过type属性控制输入形式。
<select>:定义下拉列表,<option>定义列表项。
<textarea>:文本域






相关文章:
HTML-JavaWeb
目录 1.标题排版 2.标题样式 编辑 编辑 小结 3.超链接 4.正文排版 编辑编辑编辑5.正文布局 6.表格标签 7.表单标签 8.表单项标签 1.标题排版 ● 图片标签 :< img> src:指定图像的ur1(绝对路径/相对路径) width:图像的宽度(像素/相对于父元素的百…...
数组-检查数组内是否存在和为7的倍数的子序列
一、题目描述 二、解题思路 这里首先要分辨清楚是子序列还是子数组 原数组:[1,2,3,4,5] 子序列:元素和元素之间相对位置保持不变,但是在原数组中不一定连续,如:[1,3,4]; 子数组:元素元素之间保…...
【图像处理与机器视觉】图像处理概述与像素
什么是数字图像处理 改善图像信息,便于作出解释 方便对图像传输,储存,方便机器理解 什么是数字图像 (1)模拟图像:连续二维函数 f(x,y)表示,其中 x…...
虚函数的性能消耗到底在哪?
虚函数的性能消耗 聊到虚函数的性能开销,大家的第一反应肯定是间接调用上,何为间接调用? 当调用一个虚函数时,实际执行的函数版本是在运行时通过虚函数表(virtualtable)查找确定的。这个查找过程是一个间接…...
Visual Studio 的使用
目录 1. 引言 2. 安装和配置 2.1 系统要求 2.2 安装步骤 2.3 初次配置 3. 界面介绍 3.1 菜单栏和工具栏 3.2 解决方案资源管理器 3.3 编辑器窗口 3.4 输出窗口 3.5 错误列表 3.6 属性窗口 4. 项目管理 4.1 创建新项目 4.2 导入现有项目 4.3 项目属性配置 5. 代…...
Web前端与App前端:深入剖析两者的异同
Web前端与App前端:深入剖析两者的异同 在数字化时代,前端技术已成为连接用户与数字世界的桥梁。然而,当我们谈及前端时,往往会遇到两个相似的概念:Web前端和App前端。这两者是否完全相同,还是各有千秋&…...
初学者必读:Midjourney AI创作工具的简易使用手册!
在数字化时代,AI的应用不断推动着各个领域的发展。在这些领域中,AI在艺术和设计方面的应用引起了广泛的关注。AI绘画软件作为今年的热门,Midjourney 通过其独特的原理和方便的使用方法,为创作者提供了一个全新的创作逼真绘画的平台…...
使用python绘制一个五颜六色的爱心
使用python绘制一个五颜六色的爱心 介绍效果代码 介绍 使用numpy与matplotlib绘制一个七彩爱心! 效果 代码 import numpy as np import matplotlib.pyplot as plt# Heart shape function def heart_shape(t):x 16 * np.sin(t)**3y 13 * np.cos(t) - 5 * np.cos…...
关于锂电池短路测试
了解锂电池短路测试 电池短路试验测试标准有哪些?宏展告诉你 - 哔哩哔哩 (bilibili.com) 电池电芯上架亚马逊美国站认证标准和要求UL1642测试 - 知乎 (zhihu.com) CR123A电池的短路试验: CR123A电池为例_锂锰电池所需通过的安全性能测试_纽扣电池_锂锰电池_松下电…...
排序(前篇)
1.排序的概念及其运用 2.插入排序的概念及实现 3.希尔排序的概念及实现 4.选择排序概念及实现 总代码(对比各个排序在大量的数据情况排序所化的时间): 1.排序的概念及其运用 1.1排序的概念 排序:所谓排序,就是使…...
Linux学习笔记(二)
一、Linux文件目录 1.命令:tree -L 1 2.挂载命令(例如U盘,需要挂载之后才能访问): mount /dev/cdrom /mnt ls /mnt 3.查看登录信息: last / lastlog 4.修改/查看网络信息 vi /etc/sysconfig/netw…...
Git——pull request详细教程
当我们需要协助其他仓库完成更改时,往往会用到git中的Pull Request操作,从而方便团队的协作管理和代码持续集成。 下面是详细的教程步骤。 一. Fork目标项目 比如说我现在要fork以下Qwen-VL的项目,如图所示: 随后点击Create即可…...
Prompt工程与实践
Prompt工程与实践 一、Prompt与大模型 1.1 大模型的定义 大模型本质上就是一个概率生成模型,该模型的模型参数足够大,并且在训练过程中阅读了非常多的各个领域的语料。这个时候,如果通过一个正确的、有效的指令去引导这个模型,…...
电脑录屏怎么录?7个电脑录屏软件免费版强势来袭,赶快收藏!
电脑录屏怎么录?相信很多小伙伴们都不知道怎么在Windows电脑上录屏吧?在当今社会,随着互联网的快速发展,越来越多的小伙伴们开始通过制作视频内容来分享知识、展示技能或者记录生活。电脑录屏成为了一种简单高效的方式,…...
ts: 映射类型
映射类型会携带接口的可选和只读属性 interface User { name: string; age?: number; readonly email: string; } interface User { name: string; age?: number; readonly email: string; } type change<T> {[P in keyof T]: T[P] } type obj change<…...
调出idea解决冲突界面
背景 我对idea使用不熟练,还是习惯用git bash来合并代码,合并爆冲突后,我进入idea准备解决冲突,却发现找不到解决冲突的界面。 解决 右击idea中冲突的文件,将鼠标移动到菜单栏的git上,此时应该出现包含有…...
android studio项目 gradle-xx-bin.zip下载失败或很慢的解决方法
一、环境: gradle官网:https://services.gradle.org/distributions/ IDE: android studio 二、下载并拷贝以下文件 下面已 gradle-8.0 为例,gradle缓存目录为(file->settings->Build,Execution…->Build Tools->Gradle查看Gradle…...
Python系列:教你使用PyMySQL操作MySQL数据库
Python系列 PyMySQL操作MySQL数据库 - 文章信息 - Author: 李俊才 (jcLee95) Visit me at CSDN: https://jclee95.blog.csdn.netMy WebSite:http://thispage.tech/Email: 291148484163.com. Shenzhen ChinaAddress of this article:https://blog.csdn.net/qq_2855…...
mysql数据库管理面试题-1
1. 描述MySQL架构及其主要组件(例如存储引擎、缓存、优化器等)。 MySQL的架构可以分为三层: 客户端层:这是用户和MySQL数据库交互的接口,包括命令行工具、图形化管理工具等。 服务层:这是MySQL的核心部分…...
Linux安装zsh并配置oh-my-zsh
配置oh-my-zsh 查看当前shell安装zsh切换到zsh配置ohmysh 查看当前shell cat /etc/shells# /etc/shells: valid login shells /bin/sh /bin/bash /usr/bin/bash /bin/rbash /usr/bin/rbash /bin/dash /usr/bin/dash安装zsh sudo apt install zsh# /etc/shells: valid login s…...
突破平台限制:WorkshopDL重构Steam创意工坊资源获取体验
突破平台限制:WorkshopDL重构Steam创意工坊资源获取体验 【免费下载链接】WorkshopDL WorkshopDL - The Best Steam Workshop Downloader 项目地址: https://gitcode.com/gh_mirrors/wo/WorkshopDL WorkshopDL作为一款仅10MB大小的开源工具,通过智…...
Llama-3.2V-11B-cot实战:基于SpringBoot构建企业级智能客服原型
Llama-3.2V-11B-cot实战:基于SpringBoot构建企业级智能客服原型 最近在帮一个朋友的公司做技术选型,他们想快速搭建一个智能客服原型,既要成本可控,又要能快速集成到现有的Java技术栈里。聊了一圈,发现很多团队都卡在…...
快速体验WAN2.2文生视频:ComfyUI预置工作流,2分钟生成测试视频
快速体验WAN2.2文生视频:ComfyUI预置工作流,2分钟生成测试视频 1. 为什么选择WAN2.2文生视频工作流 如果你正在寻找一个简单易用、效果出色的文生视频工具,WAN2.2文生视频工作流绝对值得一试。这个预置在ComfyUI中的工作流,让视…...
C++ 智能指针陷阱与调试技巧
C智能指针陷阱与调试技巧 在现代C开发中,智能指针是管理动态内存的利器,能有效避免内存泄漏和悬空指针等问题。若使用不当,智能指针本身也可能成为陷阱,导致难以察觉的bug。本文将深入探讨几种常见的智能指针陷阱,并分…...
重构PDF知识管理:Obsidian PDF++让文献处理效率提升300%的实战指南
重构PDF知识管理:Obsidian PDF让文献处理效率提升300%的实战指南 【免费下载链接】obsidian-pdf-plus PDF: the most Obsidian-native PDF annotation & viewing tool ever. Comes with optional Vim keybindings. 项目地址: https://gitcode.com/gh_mirrors/…...
从单片机思维到FPGA思维:我用Xilinx Ego1做循迹小车踩过的那些‘坑’
从单片机思维到FPGA思维:Xilinx Ego1循迹小车开发实战避坑指南 第一次用FPGA做循迹小车时,我盯着Vivado里密密麻麻的时序报告发呆了半小时——这和我熟悉的单片机开发完全是两个世界。作为有三年STM32开发经验的工程师,本以为凭借Verilog语法…...
深入解析Android系统分区:从启动到恢复的完整指南
1. Android系统分区基础认知 当你第一次拆解Android系统时,可能会被各种分区名称搞得晕头转向。其实这些分区就像我们电脑里的C盘、D盘一样,各自承担着不同的职责。我刚开始接触时也犯过糊涂,直到有次刷机把boot分区刷坏,手机直接…...
电路板焊接缺陷解析与预防指南
1. 电路板焊接缺陷全解析作为一名硬件工程师,焊接就像吃饭喝水一样是必备技能。但即使是最资深的工程师,也难免会遇到各种焊接问题。今天我就结合自己多年的实战经验,为大家详细剖析16种最常见的焊接缺陷,从外观特征到成因分析&am…...
OpenRocket终极指南:专业火箭设计与飞行仿真软件完全解析
OpenRocket终极指南:专业火箭设计与飞行仿真软件完全解析 【免费下载链接】openrocket Model-rocketry aerodynamics and trajectory simulation software 项目地址: https://gitcode.com/GitHub_Trending/op/openrocket OpenRocket是一款功能强大的开源火箭…...
2026全年求职时间线|应届生必看,错过可能再等一年
关注 霍格沃兹测试学院公众号,回复「资料」, 领取人工智能测试开发技术合集如果你是2026届、2027届毕业生,这篇文章建议收藏转发。应届生身份只有一次,用好了是红利,用错了可能错过一整年机会。都说今年工作难找,那我们…...

