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

HTMLCSS(入门)

HTML

<html> <head><title>第一个页面</title></head><body>键盘敲烂,工资过万</body>
</html>

<!DOCTYPE>文档类型声明,告诉浏览器使用哪种HTML版本显示网页

<!DOCTYPE html>当前页面采取的四HTML5版本来显示网页

位于<html>标签之前

不是一个HTML标签,只是文档类型声明标签

lang语言:定义当前文档显示的语言

标题段落标签

标题标签<h1> - <h6> 作为标题使用,重要性递减

段落标签<p><p/> (Alt+z 自动换行)段落之前会有空隙

换行标签<br /> 强制换行,单标签,换行后不会增加垂直间距

文本格式化标签

加粗标签<strong>加粗</strong>

倾斜标签<em>倾斜<em/>

删除线标签<del>删除线<del/>

下划线标签<ins>下划线<ins/>

盒子标签

<div>和<span>标签

div标签单独占一行,一行只能有一个div

span标签一行可以放多个span

图像标签和路径

图像标签

路径
相对路径

绝对路径

超链接标签

链接标签<a href="lianjie" target="...">文本或图像</a>

target是打开窗口的凡是,默认值为_self

_self表示在此窗口中打开链接

_blank表示在新窗口中打开

注释标签和特殊字符

表格

表格是用来展示数据的

表格基本用法

表头单元格标签(<th><th/>)

表格属性

不详细叙述,之后在css详细学习

表格结构标签

表格头部区域<thead> </thead>

表格主体区域<tbody> </tbody>

合并单元格

列表

分为三类:无序列表,有序列表,自定义列表

无序列表(<ul></ul>)

有序列表(<ol></ol>)

自定义列表

未完待续。。。

表单

目的为了收集信息

表单的组成

表单域,表单控件,表单信息

表单域(<form></form>)

包含元素的区域

表单控件
<input>输入表单元素

<select>下拉表单元素

定义下拉列表

<textarea>文本域元素

输入内容较多,用于定义多行文本输入的控件

查阅文档

W3C:w3school 在线教程

MDN:https://developer.mozilla.org/zh-CN/docs/Web

CSS

CSS美化HTML,实现结构和样式的分离

CSS:由选择器和一条或多条声明组成

CSS基础选择器

选择器用来选择标签

标签选择器

类选择器
基本使用

口诀:

样式点定义

结构类调佣

一个或多个

开发最常用

特殊使用:多类名

优点:

(1)可以把一些标签元素相司的样式(共同的部分)放到一个类里面,

(2)这些标签都可以调用这个公共的类然后再调用自己独有的类

(3)从而节省CSS代码,统一修改也非常方便

id选择器

通配符选择器

CSS字体属性

字体系列

字体大小

字体粗细

文字样式

字体复合属性

CSS文本属性

文本颜色(color)

对齐文本(text-align)

装饰文本(text-decoration)

文本缩进(text-indent)

行间距(line-height)

CSS的引入方式

按照CSS样式书写的位置(或者引入的方式)分类:

行内样式表(行内式)

内部样式表(嵌入式)

外部样式表(链接式)

内部样式表(style放在html中)

行内样式表(放在具体标签中)

外部样式表(引入html外的css文件)

Chrome调试工具

摘自黑马pink

相关文章:

HTMLCSS(入门)

HTML <html> <head><title>第一个页面</title></head><body>键盘敲烂&#xff0c;工资过万</body> </html> <!DOCTYPE>文档类型声明&#xff0c;告诉浏览器使用哪种HTML版本显示网页 <!DOCTYPE html>当前页面采取…...

富格林:曝光可信策略制止亏损

富格林指出&#xff0c;相信大家都对黄金投资的价值空间有目共睹&#xff0c;现如今黄金市场波动频繁&#xff0c;因此不少投资者也开始加入该市场试图赢得额外的财富。但作为新手投资者贸贸然地进场操作&#xff0c;亏损的几率是很大的&#xff0c;因此要学会掌握正规平台曝光…...

Android --- Service

出自于此&#xff0c;写得很清楚。关于Android Service真正的完全详解&#xff0c;你需要知道的一切_android service-CSDN博客 出自【zejian的博客】 什么是Service? Service(服务)是一个一种可以在后台执行长时间运行操作而没有用户界面的应用组件。 服务可由其他应用组件…...

Vue3从入门到精通(三)

vue3插槽Slots 在 Vue3 中&#xff0c;插槽&#xff08;Slots&#xff09;的使用方式与 Vue2 中基本相同&#xff0c;但有一些细微的差异。以下是在 Vue3 中使用插槽的示例&#xff1a; // ChildComponent.vue <template><div><h2>Child Component</h2&…...

【FreeRTOS】同步与互斥通信-有缺陷的互斥案例

目录 同步与互斥通信同步与互斥的概念同步与互斥并不简单缺陷分析汇编指令优化过程 - 关闭中断时间轴分析 思考时刻 参考《FreeRTOS入门与工程实践(基于DshanMCU-103).pdf》 同步与互斥通信 同步与互斥的概念 一句话理解同步与互斥&#xff1a;我等你用完厕所&#xff0c;我再…...

Docker 安装 Python

Docker 安装 Python 在当今的软件开发领域,Docker 已成为一项关键技术,它允许开发人员将应用程序及其依赖环境打包到一个可移植的容器中。Python,作为一种广泛使用的高级编程语言,经常被部署在 Docker 容器中。本文将详细介绍如何在 Docker 中安装 Python,以及如何配置环…...

外泌体相关基因肝癌临床模型预测——2-3分纯生信文章复现——4.预后相关外泌体基因确定单因素cox回归(2)

内容如下&#xff1a; 1.外泌体和肝癌TCGA数据下载 2.数据格式整理 3.差异表达基因筛选 4.预后相关外泌体基因确定 5.拷贝数变异及突变图谱 6.外泌体基因功能注释 7.LASSO回归筛选外泌体预后模型 8.预后模型验证 9.预后模型鲁棒性分析 10.独立预后因素分析及与临床的…...

C++: Map数组的遍历

在C中&#xff0c;map是一个关联容器&#xff0c;它存储的元素是键值对&#xff08;key-value pairs&#xff09;&#xff0c;其中每个键都是唯一的&#xff0c;并且自动根据键来排序。遍历map的方式有几种&#xff0c;但最常用的两种是使用迭代器&#xff08;iterator&#xf…...

【Windows】Bootstrap Studio(网页设计)软件介绍及安装步骤

软件介绍 Bootstrap Studio 是一款专为前端开发者设计的强大工具&#xff0c;主要用于快速创建现代化的响应式网页和网站。以下是它的主要特点和功能&#xff1a; 直观的界面设计 Bootstrap Studio 提供了直观的用户界面&#xff0c;使用户能够轻松拖放元素来构建网页。界面…...

二维舵机颜色追踪,使用树莓派+opencv+usb摄像头+两个舵机实现颜色追踪,采用pid调控

效果演示 二维云台颜色追踪 使用树莓派opencvusb摄像头两个舵机实现颜色追踪&#xff0c;采用pid调控 import cv2 import time import numpy as np from threading import Thread from servo import Servo from pid import PID# 初始化伺服电机 pan Servo(pin19) tilt Serv…...

c进阶篇(四):内存函数

内存函数以字节为单位更改 1.memcpy memcpy 是 C/C 中的一个标准库函数&#xff0c;用于内存拷贝操作。它的原型通常定义在 <cstring> 头文件中&#xff0c;其作用是将一块内存中的数据复制到另一块内存中。 函数原型&#xff1a;void *memcpy(void *dest, const void…...

新手入门:无服务器函数和FaaS简介

无服务器&#xff08;Serverless&#xff09;架构的价值在于其成本效益、弹性和扩展性、简化的开发和部署流程、高可用性和可靠性以及使开发者能够专注于业务逻辑。通过自动化资源调配和按需计费&#xff0c;无服务器架构能够降低成本并适应流量变化&#xff0c;同时简化开发流…...

基于Transformer的端到端的目标检测 | 读论文

本文正在参加 人工智能创作者扶持计划 提及到计算机视觉的目标检测&#xff0c;我们一般会最先想到卷积神经网络&#xff08;CNN&#xff09;&#xff0c;因为这算是目标检测领域的开山之作了&#xff0c;在很长的一段时间里人们都折服于卷积神经网络在图像处理领域的优势&…...

6.8应用进程跨网络通信

《计算机网络》第7版&#xff0c;谢希仁 理解socket通信...

redis布隆过滤器原理及应用场景

目录 原理 应用场景 优点 缺点 布隆过滤器&#xff08;Bloom Filter&#xff09;是一种空间效率很高的随机数据结构&#xff0c;它利用位数组和哈希函数来判断一个元素是否存在于集合中。 原理 数据结构&#xff1a; 位数组&#xff1a;一个由0和1组成的数组&#xff0c;初始…...

vue+openlayers之几何图形交互绘制基础与实践

文章目录 1.实现效果2.实现步骤3.示例页面代码3.基本几何图形绘制的关键代码 1.实现效果 绘制点、线、多边形、圆、正方形、长方形 2.实现步骤 引用openlayers开发库。加载天地图wmts瓦片地图。在页面上添加几何图形绘制的功能按钮&#xff0c;使用下拉列表&#xff08;sel…...

「多模态大模型」解读 | 突破单一文本模态局限

编者按&#xff1a;理想状况下&#xff0c;世界上的万事万物都能以文字的形式呈现&#xff0c;如此一来&#xff0c;我们似乎仅凭大语言模型&#xff08;LLMs&#xff09;就能完成所有任务。然而&#xff0c;理想很丰满&#xff0c;现实很骨感——数据形态远不止文字一种&#…...

Redis深度解析:核心数据类型与键操作全攻略

文章目录 前言redis数据类型string1. 设置单个字符串数据2.设置多个字符串类型的数据3.字符串拼接值4.根据键获取字符串的值5.根据多个键获取多个值6.自增自减7.获取字符串的长度8.比特流操作key操作a.查找键b.设置键值的过期时间c.查看键的有效期d.设置key的有效期e.判断键是否…...

C语言 指针和数组——指针的算术运算

目录 指针的算术运算 指针加上一个整数 指针减去一个整数 指针相减 指针的关系比较运算 小结 指针的算术运算 指针加上一个整数 指针减去一个整数 指针相减 指针的关系比较运算 小结  指针变量 – 指针类型的变量&#xff0c;保存地址型数据  指针变量与其他类型…...

[C++][CMake][CMake基础]详细讲解

目录 1.CMake简介2.大小写&#xff1f;3.注释1.注释行2.注释块 4.日志 1.CMake简介 CMake是一个项目构建工具&#xff0c;并且是跨平台的 问题 – 解决 如果自己动手写Makefile&#xff0c;会发现&#xff0c;Makefile通常依赖于当前的编译平台&#xff0c;而且编写Makefile的…...

【Linux】shell脚本忽略错误继续执行

在 shell 脚本中&#xff0c;可以使用 set -e 命令来设置脚本在遇到错误时退出执行。如果你希望脚本忽略错误并继续执行&#xff0c;可以在脚本开头添加 set e 命令来取消该设置。 举例1 #!/bin/bash# 取消 set -e 的设置 set e# 执行命令&#xff0c;并忽略错误 rm somefile…...

java_网络服务相关_gateway_nacos_feign区别联系

1. spring-cloud-starter-gateway 作用&#xff1a;作为微服务架构的网关&#xff0c;统一入口&#xff0c;处理所有外部请求。 核心能力&#xff1a; 路由转发&#xff08;基于路径、服务名等&#xff09;过滤器&#xff08;鉴权、限流、日志、Header 处理&#xff09;支持负…...

令牌桶 滑动窗口->限流 分布式信号量->限并发的原理 lua脚本分析介绍

文章目录 前言限流限制并发的实际理解限流令牌桶代码实现结果分析令牌桶lua的模拟实现原理总结&#xff1a; 滑动窗口代码实现结果分析lua脚本原理解析 限并发分布式信号量代码实现结果分析lua脚本实现原理 双注解去实现限流 并发结果分析&#xff1a; 实际业务去理解体会统一注…...

C++.OpenGL (10/64)基础光照(Basic Lighting)

基础光照(Basic Lighting) 冯氏光照模型(Phong Lighting Model) #mermaid-svg-GLdskXwWINxNGHso {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-GLdskXwWINxNGHso .error-icon{fill:#552222;}#mermaid-svg-GLd…...

【HarmonyOS 5 开发速记】如何获取用户信息(头像/昵称/手机号)

1.获取 authorizationCode&#xff1a; 2.利用 authorizationCode 获取 accessToken&#xff1a;文档中心 3.获取手机&#xff1a;文档中心 4.获取昵称头像&#xff1a;文档中心 首先创建 request 若要获取手机号&#xff0c;scope必填 phone&#xff0c;permissions 必填 …...

Yolov8 目标检测蒸馏学习记录

yolov8系列模型蒸馏基本流程&#xff0c;代码下载&#xff1a;这里本人提交了一个demo:djdll/Yolov8_Distillation: Yolov8轻量化_蒸馏代码实现 在轻量化模型设计中&#xff0c;**知识蒸馏&#xff08;Knowledge Distillation&#xff09;**被广泛应用&#xff0c;作为提升模型…...

浪潮交换机配置track检测实现高速公路收费网络主备切换NQA

浪潮交换机track配置 项目背景高速网络拓扑网络情况分析通信线路收费网络路由 收费汇聚交换机相应配置收费汇聚track配置 项目背景 在实施省内一条高速公路时遇到的需求&#xff0c;本次涉及的主要是收费汇聚交换机的配置&#xff0c;浪潮网络设备在高速项目很少&#xff0c;通…...

Linux 中如何提取压缩文件 ?

Linux 是一种流行的开源操作系统&#xff0c;它提供了许多工具来管理、压缩和解压缩文件。压缩文件有助于节省存储空间&#xff0c;使数据传输更快。本指南将向您展示如何在 Linux 中提取不同类型的压缩文件。 1. Unpacking ZIP Files ZIP 文件是非常常见的&#xff0c;要在 …...

在Mathematica中实现Newton-Raphson迭代的收敛时间算法(一般三次多项式)

考察一般的三次多项式&#xff0c;以r为参数&#xff1a; p[z_, r_] : z^3 (r - 1) z - r; roots[r_] : z /. Solve[p[z, r] 0, z]&#xff1b; 此多项式的根为&#xff1a; 尽管看起来这个多项式是特殊的&#xff0c;其实一般的三次多项式都是可以通过线性变换化为这个形式…...

多模态图像修复系统:基于深度学习的图片修复实现

多模态图像修复系统:基于深度学习的图片修复实现 1. 系统概述 本系统使用多模态大模型(Stable Diffusion Inpainting)实现图像修复功能,结合文本描述和图片输入,对指定区域进行内容修复。系统包含完整的数据处理、模型训练、推理部署流程。 import torch import numpy …...