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

前端学习——HTML

HTML

  • VSCode常用快捷键
  • HTML标签
    • 文本标签
    • 列表标签
    • 表格
    • Form表单
      • 表单元素
    • 块元素与行内元素
    • 新增标签

VSCode常用快捷键

代码格式化:Shift+Alt+F
向上或向下移动一行:Alt+Up或Alt+Down
快速复制一行代码:Shift+Alt+Up或者Shift+Alt+Down
快速替换:Ctrl+H

HTML标签

文本标签

定义着重文字
定义粗体文字
定义斜体文字
加重语气
删除字
无特定含义

列表标签

1、有序列表

//type可以改变列表项目标签
// 1:用数字标号;A:用大写字母标号;a:用小写字母标号;i:小写罗马数字标号;I:大写罗马数字标号
<ol type=''><li></li>
</ol>

2、无序列表

//type属性
//disc:默认实心圆;circle:空心圆;square:小方块;none:不显示
<ul><li></li>
</ul>

应用于导航效果
3、快捷键:ul>li*n
n为li标签的数量

表格

//type属性
//
<table><tr>//行<td></td>//列</tr>
</table>

1、快捷键
table>tr2>td3{单元格}
2、表格属性
border:设置边框
width:单元格宽度
height:单元格的高度
3、表格单元格合并
水平合并:colspan,水平合并保留左边删除右边
垂直合并:rowspan,垂直合并保留上边删除下边

//type属性
//
<table><tr>//行<td></td>//列<td></td>//列<td></td>//列</tr><tr>//行<td colspan="2"></td>//列<td></td>//列</tr>
</table>

Form表单

用户输入的地方都会有表单,交互

// An highlighted block
<form action="url" method="get/post" name="myForm"></form> 

action:服务器地址
method:get和post
不同的提交方式,get把提交的数据url可以看到,post看不到
get一般很少提交数据,post用于提交大量数据
name:表单名称

表单元素

// An highlighted block
<form><input type="text"><input type="submmit">
</form> 

1、文本

// An highlighted block
<form>用户名:<input type="text">
</form> 

2、密码

// An highlighted block
<form>密码:<input type="password" name="pwd">
</form> 

3、提交按钮

// An highlighted block
<form>用户名:<input type="text">密码:<input type="password" name="pwd"><input type="submmit" value="登录">
</form> 

块元素与行内元素

在这里插入图片描述
1、块元素
div form h1~h6 hr p table ul ol
2、内联元素
a b em span i strong
3、行内块级元素(不换行,能够识别宽高)
button img input

新增标签

div标签:容器
在这里插入图片描述

相关文章:

前端学习——HTML

HTML VSCode常用快捷键HTML标签文本标签列表标签表格Form表单表单元素 块元素与行内元素新增标签 VSCode常用快捷键 代码格式化&#xff1a;ShiftAltF 向上或向下移动一行&#xff1a;AltUp或AltDown 快速复制一行代码&#xff1a;ShiftAltUp或者ShiftAltDown 快速替换&#x…...

12.【线性代数】——图和网络

十二 图和网络&#xff08;线性代数的应用&#xff09; 图 g r a p h { n o d e s , e d g e s } graph\{nodes, edges\} graph{nodes,edges}1.关联矩阵2. A A A矩阵的零空间&#xff0c;求解 A x 0 Ax0 Ax0 电势3. A T A^T AT矩阵的零空间&#xff0c;电流总结电流图结论 …...

[环境搭建篇] Windows 环境下如何安装repo工具

Windows 环境下如何安装repo工具 1. 安装前置依赖2. 配置Repo引导脚本方法一&#xff1a;通过Gitee镜像安装&#xff08;推荐&#xff09;方法二&#xff1a;通过清华镜像安装 3. 解决依赖问题4. 初始化Repo仓库5. 常见问题解决 前言&#xff1a; 在Windows环境下安装Repo工具需…...

LeetCode 热题 100_字符串解码(71_394_中等_C++)(栈)

LeetCode 热题 100_字符串解码&#xff08;71_394&#xff09; 题目描述&#xff1a;输入输出样例&#xff1a;题解&#xff1a;解题思路&#xff1a;思路一&#xff08;栈&#xff09;&#xff1a; 代码实现代码实现&#xff08;栈&#xff09;&#xff1a;以思路一为例进行调…...

「DataX」数据迁移-IDEA运行DataX方法总结

背景 业务需求希望把Oracle数据库中的数据&#xff0c;迁移至MySql数据库中&#xff0c;因为需要迁移全量和增量的数据&#xff0c;所以希望想用数据迁移工具进行操作。 经过一些调研查询&#xff0c;最终打算使用DataX进行数据的迁移。 DataX简单介绍 DataX 是阿里云 DataW…...

【 <一> 炼丹初探:JavaWeb 的起源与基础】之 Servlet 过滤器:实现请求的预处理与后处理

<前文回顾> 点击此处查看 合集 https://blog.csdn.net/foyodesigner/category_12907601.html?fromshareblogcolumn&sharetypeblogcolumn&sharerId12907601&sharereferPC&sharesourceFoyoDesigner&sharefromfrom_link <今日更新> 一、过滤器&…...

DeepSeek与浏览器自动化AI Agent构建指南

文章使用到的模型可以用硅基流动中的&#xff1a; 注册链接&#xff1a;硅基流动统一登录 邀请码&#xff1a;FytHp9Xa 一、技术选型阶段 1. 基础组件选择 AI模型&#xff1a;DeepSeek-R1开放API&#xff08;对话/推理&#xff09;或DeepSeek-Coder&#xff08;代码生成&#…...

面试中常问的mysql数据库指令【杭州多测师_王sir】

数据库中的修改表结构、增删改查、用户权限操作DDL 》数据库定义语言 create database&#xff0c;create table drop tableDML 》数据库操作语言 insert into&#xff0c;delete from&#xff0c;update set&#xff0c;DQL 》数据库查询语言 select .... from....crea…...

深度学习驱动的智能化革命:从技术突破到行业实践

第一章 深度学习的技术演进与核心架构 1.1 从浅层网络到深度学习的范式转变 深度学习的核心在于通过多层次非线性变换自动提取数据特征,其发展历程可划分为三个阶段:符号主义时代的规则驱动(1950s-1980s)、连接主义时代的浅层网络(1990s-2000s)以及深度学习时代的端到端…...

基于编译器特性浅析C++程序性能优化

最近在恶补计算机基础知识&#xff0c;学到CSAPP第五章的内容&#xff0c;在这里总结并且展开一下C程序性能优化相关的内容。 衡量程序性能的方式 一般而言&#xff0c;程序的性能可以用CPE&#xff08;Cycles Per Element&#xff09;来衡量&#xff0c;其指的是处理每个元素…...

服务器上通过ollama部署deepseek

2025年1月下旬&#xff0c;DeepSeek的R1模型发布后的一周内就火了&#xff0c;性能比肩OpenAI的o1模型&#xff0c;且训练成本仅为560万美元&#xff0c;成本远低于openAI&#xff0c;使得英伟达股票大跌。 下面我们来看下如何个人如何部署deepseek-r1模型。 我是用的仙宫云的…...

Android Coil总结

文章目录 Android Coil总结概述添加依赖用法基本用法占位图变形自定义ImageLoader取消加载协程支持缓存清除缓存监听 简单封装 Android Coil总结 概述 Coil 是一个用于 Android 的 Kotlin 图像加载库&#xff0c;旨在简化图像加载和显示的过程。它基于 Kotlin 协程&#xff0…...

《安富莱嵌入式周报》第351期:DIY半导体制造,工业设备抗干扰提升方法,NASA软件开发规范,小型LCD在线UI编辑器,开源USB PD电源,开源锂电池管理

周报汇总地址&#xff1a;嵌入式周报 - uCOS & uCGUI & emWin & embOS & TouchGFX & ThreadX - 硬汉嵌入式论坛 - Powered by Discuz! 视频版&#xff1a; https://www.bilibili.com/video/BV16C95YEEZs 《安富莱嵌入式周报》第351期&#xff1a;DIY半导体…...

Redis在人员管理系统中的应用示例

用户会话管理 场景&#xff1a;用户登录后存储会话信息&#xff0c;支持多服务器共享 实现&#xff1a; 用户登录成功后&#xff0c;生成唯一Token&#xff08;如JWT&#xff09;&#xff0c;作为Redis的Key Value存储用户ID、角色、权限等信息&#xff0c;设置过期时间&…...

The Wedding Juicer POJ - 2227

采取从外层边界&#xff0c;一步一步向内部拓展的策略&#xff0c;具体来说&#xff0c;一开始将最外面一层的点加入队列&#xff0c;并标记这些点的坐标已经被访问 取出队列中高度最低的点&#xff0c;将其弹出&#xff0c;查看其上下左右的点&#xff0c;如果新点没有被访问…...

# 深入理解RNN(一):循环神经网络的核心计算机制

深入理解RNN&#xff1a;循环神经网络的核心计算机制 RNN示意图 引言 在自然语言处理、时间序列预测、语音识别等涉及序列数据的领域&#xff0c;循环神经网络(RNN)一直扮演着核心角色。尽管近年来Transformer等架构逐渐成为主流&#xff0c;RNN的基本原理和思想依然对于理…...

分布式锁—6.Redisson的同步器组件

大纲 1.Redisson的分布式锁简单总结 2.Redisson的Semaphore简介 3.Redisson的Semaphore源码剖析 4.Redisson的CountDownLatch简介 5.Redisson的CountDownLatch源码剖析 1.Redisson的分布式锁简单总结 (1)可重入锁RedissonLock (2)公平锁RedissonFairLock (3)联锁MultiL…...

同步 Fork 仓库的命令

同步 Fork 仓库的命令 要将您 fork 的仓库的 main 分支与原始仓库&#xff08;fork 源&#xff09;同步&#xff0c;您可以使用以下命令&#xff1a; 首先&#xff0c;确保您已经添加了原始仓库作为远程仓库&#xff08;如果尚未添加&#xff09;&#xff1a; git remote add…...

基于PySide6的CATIA零件自动化着色工具开发实践

引言 在汽车及航空制造领域&#xff0c;CATIA作为核心的CAD设计软件&#xff0c;其二次开发能力对提升设计效率具有重要意义。本文介绍一种基于Python的CATIA零件着色工具开发方案&#xff0c;通过PySide6实现GUI交互&#xff0c;结合COM接口操作实现零件着色自动化。该方案成…...

OpenManus 的提示词

OpenManus 的提示词 引言英文提示词的详细内容工具集的详细说明中文翻译的详细内容GitHub 仓库信息背景分析总结 引言 OpenManus 是一个全能 AI 助手&#xff0c;旨在通过多种工具高效地完成用户提出的各种任务&#xff0c;包括编程、信息检索、文件处理和网页浏览等。其系统提…...

国防科技大学计算机基础课程笔记02信息编码

1.机内码和国标码 国标码就是我们非常熟悉的这个GB2312,但是因为都是16进制&#xff0c;因此这个了16进制的数据既可以翻译成为这个机器码&#xff0c;也可以翻译成为这个国标码&#xff0c;所以这个时候很容易会出现这个歧义的情况&#xff1b; 因此&#xff0c;我们的这个国…...

如何在看板中体现优先级变化

在看板中有效体现优先级变化的关键措施包括&#xff1a;采用颜色或标签标识优先级、设置任务排序规则、使用独立的优先级列或泳道、结合自动化规则同步优先级变化、建立定期的优先级审查流程。其中&#xff0c;设置任务排序规则尤其重要&#xff0c;因为它让看板视觉上直观地体…...

无法与IP建立连接,未能下载VSCode服务器

如题&#xff0c;在远程连接服务器的时候突然遇到了这个提示。 查阅了一圈&#xff0c;发现是VSCode版本自动更新惹的祸&#xff01;&#xff01;&#xff01; 在VSCode的帮助->关于这里发现前几天VSCode自动更新了&#xff0c;我的版本号变成了1.100.3 才导致了远程连接出…...

C++ 基础特性深度解析

目录 引言 一、命名空间&#xff08;namespace&#xff09; C 中的命名空间​ 与 C 语言的对比​ 二、缺省参数​ C 中的缺省参数​ 与 C 语言的对比​ 三、引用&#xff08;reference&#xff09;​ C 中的引用​ 与 C 语言的对比​ 四、inline&#xff08;内联函数…...

鸿蒙中用HarmonyOS SDK应用服务 HarmonyOS5开发一个生活电费的缴纳和查询小程序

一、项目初始化与配置 1. 创建项目 ohpm init harmony/utility-payment-app 2. 配置权限 // module.json5 {"requestPermissions": [{"name": "ohos.permission.INTERNET"},{"name": "ohos.permission.GET_NETWORK_INFO"…...

用docker来安装部署freeswitch记录

今天刚才测试一个callcenter的项目&#xff0c;所以尝试安装freeswitch 1、使用轩辕镜像 - 中国开发者首选的专业 Docker 镜像加速服务平台 编辑下面/etc/docker/daemon.json文件为 {"registry-mirrors": ["https://docker.xuanyuan.me"] }同时可以进入轩…...

【C++从零实现Json-Rpc框架】第六弹 —— 服务端模块划分

一、项目背景回顾 前五弹完成了Json-Rpc协议解析、请求处理、客户端调用等基础模块搭建。 本弹重点聚焦于服务端的模块划分与架构设计&#xff0c;提升代码结构的可维护性与扩展性。 二、服务端模块设计目标 高内聚低耦合&#xff1a;各模块职责清晰&#xff0c;便于独立开发…...

Redis数据倾斜问题解决

Redis 数据倾斜问题解析与解决方案 什么是 Redis 数据倾斜 Redis 数据倾斜指的是在 Redis 集群中&#xff0c;部分节点存储的数据量或访问量远高于其他节点&#xff0c;导致这些节点负载过高&#xff0c;影响整体性能。 数据倾斜的主要表现 部分节点内存使用率远高于其他节…...

C++ Visual Studio 2017厂商给的源码没有.sln文件 易兆微芯片下载工具加开机动画下载。

1.先用Visual Studio 2017打开Yichip YC31xx loader.vcxproj&#xff0c;再用Visual Studio 2022打开。再保侟就有.sln文件了。 易兆微芯片下载工具加开机动画下载 ExtraDownloadFile1Info.\logo.bin|0|0|10D2000|0 MFC应用兼容CMD 在BOOL CYichipYC31xxloaderDlg::OnIni…...

力扣-35.搜索插入位置

题目描述 给定一个排序数组和一个目标值&#xff0c;在数组中找到目标值&#xff0c;并返回其索引。如果目标值不存在于数组中&#xff0c;返回它将会被按顺序插入的位置。 请必须使用时间复杂度为 O(log n) 的算法。 class Solution {public int searchInsert(int[] nums, …...