灯塔:JavaWeb笔记

news2024/10/10 3:36:25

什么是HTML、CSS?

HTML (HypeText Markup Lanage):超文本标记语言。

超文本:超过了文本的限制,比普通的文本更强大。除了文字信息,还可以定义图片、音频、视频等内容。

标记语言:由表签构成的语言

        HTML 标签都是提前预定义好的。例如:使用<a>展示超链接,使用<img>展示图片,<vedio>展示视频。

HTML代码直接在浏览器中运行,HTML标签解析。

CSS(Cascading Style Sheet):层叠样式表,用于控制页面的样式(表现)。

特点:

• HTML标签不区分大小写

• HTML标签属性值单引号双引号都可以

• HTML语法松散

新闻排版-标题排版

图片标签:<img>

        src:指定图像的url(绝对路径/相对路径)

        width:图像的宽度(像素/相对于父元素的百分比)

        height:图像的高度(像素/相较于父元素的百分比)

标题标签:<h1>-<h6>(重要程度依次减低)

水平标签:<hr>

. / :当前目录,. / 可省略

.. / :上一级目录 

标题样式

CSS引入方式:

• 行内样式:写在标签的style属性中(不推荐)

• 内嵌样式:写在style标签中(可以写在页面任何位置,但通常约定写在head标签中)

• 外联样式:写在一个单独的.css文件中(需要通过 link 标签在网页中引入)

颜色表示形式:

CSS选择器: 用来选择需要设置的样式(标签)

优先级:id选择器>类选择器>元素选择器

<span>标签

<span>是一个在开发网页时会大量用到的没有语义的布局标签

特点:一行可以显示多个(组合行内元素,宽度和高度默认由内容撑开)

超链接标签:<a href=""></a>

属性:

href:指定资源访问的url

target:指定在何处打开资源链接

_self:默认值,在当前页面打开

_blank:在空白页面打开

text-decoration:规定添加到文本的修饰,none表示定义标准的文本。

视频标签:<video>

• src:规定视频的url

• controls:显示播放控件

• width:播放器的宽度

• height:播放器的高度

音频标签:<audio>

• src:规定音频的url

• controls:显示播放控件

段落标签:<p>

文本加粗标签:<b>/<strong>

换行:<br>

段落:<p>

文本加粗:<b> <strong>

line-height:设置行高

text-indent:定义第一行的内容的缩进

text-align:规定元素中的文本的水平对齐方式

在HTML中无论输入多少个空格,只会显示一个。可以使用空格占位符:&nbsp;

盒子模型组成:

内容区域(content)、内边距区域(padding)、边框区域(border)、外边距区域(margin)

页面布局:

布局标签:实际开发网页中,会大量使用div和span这两个没有语义的布局标签

标签:<div><span>

特点:

div标签:一行只显示一个(独占一行)

宽度默认是父元素的宽度,高度默认由内容撑开

可以设置宽高(width、height)

span标签:一行可以显示多个

宽度和高度默认由内容撑开

不可以设置宽高(width、height)

注意:如果需要设置某一个方位的边框、内边距、外边距,可以在属性后面加上-位置,如:padding-top、padding-left、padding-right...

表格标签

<table>:定义表格

<tr>:定义表格中的行,一个<tr>表示一行

<th>:表示表头单元格,具有加粗居中的效果

<td>:表示普通单元格

场景:在网页中以表格(行、列)形式整齐展示数据,如:班级表

标签:

 表单标签

场景:在网页中主要负责数据采集功能,如注册、登录等数据采集。

标签:<form>

表单项:不同类型的input元素、下拉列表、文本域等

<input>:定义表单项,通过type属性控制输入形式

<select>:定义下拉列表

<textarea>:定义文本域

属性:

action:规定当提交表单时向何处发送表单数据,URL 如果不指定,默认提交到当前页面

method:规定用于发送表单数据的方式。GET(在url后面拼接表单数据,比如:?username=Tom&age=12,url长度有限制 默认值)、POST(在消息体中传递的,参数大小无限制)

注意:表单项必须有name属性才可以提交

表单标签-表单项

<input>:表单项,通过type属性控制输入形式

<select>:定义下拉列表,<option>定义列表项

<textarea>:文本域

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2200896.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

IT监控可视化:运维团队的智慧之眼

在当今这个数字化时代&#xff0c;IT系统已成为企业运营的核心支柱。随着业务的不断扩展和IT架构的日益复杂&#xff0c;运维团队面临着前所未有的挑战。如何高效、准确地监控和管理IT资源&#xff0c;确保系统的稳定性和可用性&#xff0c;成为了运维工作的重中之重。而IT监控…

利用可解释性技术增强制造质量预测模型

概述 论文地址&#xff1a;https://arxiv.org/abs/2403.18731 本研究提出了一种利用可解释性技术提高机器学习&#xff08;ML&#xff09;模型性能的方法。该方法已用于铣削质量预测&#xff0c;这一过程首先训练 ML 模型&#xff0c;然后使用可解释性技术识别不需要的特征并去…

库函数相关(上一篇补充)

一、创建自己的头文件 在当前目录下创建一个my_head.h将这个文件移动到/usr/include目录 #ifndef __MY_HEAD_H__ #define __MY_HEAD_H__#include <stdio.h> #include <errno.h> #include <string.h>#define PRINT_ERR(s) do{\printf("%s %s %d\n&quo…

MongoDB初学者入门教学:与MySQL的对比理解

&#x1f3dd;️ 博主介绍 大家好&#xff0c;我是一个搬砖的农民工&#xff0c;很高兴认识大家 &#x1f60a; ~ &#x1f468;‍&#x1f393; 个人介绍&#xff1a;本人是一名后端Java开发工程师&#xff0c;坐标北京 ~ &#x1f389; 感谢关注 &#x1f4d6; 一起学习 &…

JavaEE: HTTPS的魅力与优势揭秘

文章目录 HTTPSHTTPS 是什么HTTPS 基本工作过程Fiddle 等抓包工具,为啥能解析 HTTPS 的数据? HTTPS HTTPS 是什么 HTTPS 是一个应用层协议,是在 HTTP 协议的基础上引入了一个加密层. 几个核心概念: 明文: 要传输的原始数据.密文: 把明文进行加密之后得到一个让别人不能理解…

【算法篇】三道题理解什么是递归,回溯和剪枝

递归&#xff0c;回溯&#xff0c;剪枝 想必大家再学习算法知识的路上经常听到回溯&#xff0c;剪枝类似的概念&#xff0c;对于初学者来说&#xff0c;很容易把他们理解成一种新的算法思想&#xff0c;其实回溯和剪枝只是在递归的基础上稍加修改&#xff0c;对于解决某些特定问…

k8s的pod的管理

常用的Pod基础命令 列出所有命名空间中的所有Pod kubectl get pods --all-namespaces 列出指定命名空间中的所有Pod kubectl get pods -n <namespace> 显示指定Pod的详细信息&#xff0c;包括状态、事件等 kubectl describe pod <pod-name> -n <namespace>…

机器学习入门(一)

一、机器学习概述 1、人工智能 像人一样智能的综合与分析&#xff0c;机器模拟人类。 是一个系统&#xff0c;像人那样思考&#xff0c;像人那样理性思考。 是一个系统&#xff0c;像人那样活动&#xff0c;像人那样合理的系统 2、机器学习 让机器自动学习&#xff0c;而不…

SAP将假脱机(Spool requests)内容转换为PDF文档[RSTXPDFT4]

将假脱机(Spool requests)内容转换为PDF文档[RSTXPDFT4] 有时需要将Spool中的内容导出成PDF文件&#xff0c;sap提供了一个标准程序RSTXPDFT4可以实现此功能。 1, Tcode:SP01, 进入spool requests list 2, SE38 运行程序RSTXPDFT4 输入spool reqeust号码18680&#xff0c;然后…

excel 单元格嵌入图片

1.图片右键,设置图片格式 2.属性 随单元格改为位置和大小 这样的话&#xff0c;图片就会嵌入到单元格&#xff0c;也会跟着单元格的大小而改变

10-记录器

这个功能允许记录和重现以前的模拟。所有发生的事件都记录在记录器文件 recorder file中。 1 记录 所有数据仅在服务器端以二进制文件的形式写入。但是&#xff0c;记录器是使用 carla.Client管理的。 注意&#xff1a;在回放结束时&#xff0c;车辆将被设置为自动驾驶&#xf…

强化学习和QLearning及GAN到底是什么关系啊

强化学习&#xff08;Reinforcement Learning&#xff09;、Q-Learning 和生成对抗网络&#xff08;GANs&#xff09;是机器学习中的三个不同概念&#xff0c;它们虽然有一些交叉&#xff0c;但本质上是针对不同问题的技术方法。下面我来详细解释它们之间的关系和区别&#xff…

leetcode每日一题day22(24.10.2)——准时到达的列车最小时速

思路&#xff1a;这种在有约束条件情况下&#xff0c;求最值或最符合要求的情况&#xff0c;首先是很容易想到&#xff0c;从时速为1开始往后找找到满足条件就输出&#xff0c;但这无疑工程量很大&#xff0c;每种可能的速度都要对列车数组进行遍历&#xff0c; 时间复杂度为C…

链表Set_LinkList(并集)

并集是把两个集合合并&#xff0c;去除重复元素后组成的集合。 通过键盘输入将两个集合保存在链表A和链表B中&#xff0c;再创建一个链表C用于保存集合A、B的并集&#xff0c;将链表C打印输出。 提示&#xff1a; 1.相对于上一题&#xff08;链表Set_LinkList&#xff08;建立&…

java 微服务 端口冲突 redis虚拟磁盘满 nacos挂

java 微服务 端口冲突 哥 排除法呀 什么卸载软件QAQ netstat -ano | findstr :48080 输这个呀 然后 taskkill /PID 1234 /F redis虚拟磁盘满 导致 假死 挂了 nacos 挂了重启 nacosrun.bat startup -m standalone

facebook受众选择设置策略的最佳方式

在进行Facebookguanggao投放时&#xff0c;受众的选择是一个至关重要的步骤。正确的受众选择不仅能够帮助我们更好地定位目标用户&#xff0c;还能显著提高guanggao的转化率和投资回报率&#xff08;ROI&#xff09;。然而&#xff0c;受众选择的数量和范围同样是需要认真考虑的…

QtDesign预览的效果与程序运行的结果不一致的解决方法

存在的问题 使用Qt designer软件设计出来的界面&#xff0c;与转换成python程序运行出来的结果不一致&#xff0c;具体看下图 Qt designer预览结果 程序运行出来的结果 原因分析 我自己的电脑是2560*1600分辨率的屏幕&#xff0c;采用的是200%的缩放比例&#xff0c;出现这种…

虚拟机没有网络怎么解决

CentOS7为例 进入虚拟网络编辑器 1.更改设置 2.选中NAT模式点击3点击移除网络 4添加网络&#xff0c;随便选一个 5.点开NAT设置&#xff0c;记住网关 6.DHCP设置&#xff0c;注意虚拟机设置ip必须在起始ip和结束ip范围内 进入虚拟机网络适配器&#xff0c;自定义选中第4步操作…

Tailwind Css的使用

1.Tailwind Css是什么 官网解释&#xff1a;Tailwind CSS 的工作原理是扫描所有 HTML 文件、JavaScript 组件以及任何 模板中的 CSS 类&#xff08;class&#xff09;名&#xff0c;然后生成相应的样式代码并写入 到一个静态 CSS 文件中。 我的理解是利用Tailwind CSS 提供的…

Element-快速入门

什么是 Element 在现代前端开发中&#xff0c;组件化的思想日益盛行&#xff0c;Element组件库作为一款流行的UI组件库&#xff0c;特别适用于基于Vue.js的项目&#xff0c;它为开发者提供了丰富的组件和良好的开发体验。 想要使用Element的组件库&#xff0c;我们需要完成下面…