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

HTML第三节

news 2026/2/7 11:54:29

一.初识CSS

1.CSS定义

A.内部样式表
B.外部样式表 

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><link rel="stylesheet" href="./第一次.css">
</head>
<body><p>这是p标签</p><div>这是div标签</div>
</body>
</html>
P{color: aquamarine;
}
div{color: brown;font-size: 30px;
}
 C.行内写法

二.选择器

1.标签选择器

注：1.所有的p标签都会设置成一个格式 

2.类选择器 （差异化）

注：1.先定义类，再使用类

2.一个class属性可以使用多个类名

3.定义类前面要加.

3.id选择器

 

 

 4.通配符选择器

 

注：作用：清除页面中所有标签的默认格式，方便后续设置每一项格式 

三.利用类选择器画盒子

 

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.red{width: 100px;height: 100px;background-color: red;}.orange{width: 200px;height: 200px;background-color: orange;}</style>
</head>
<body><div class="red">div1</div><div class="orange">div2</div>
</body>
</html>

 四.文字控制属性

（一） 字体大小

注：1.默认字体大小为16px 

（二）字体粗细 

 （三）字体倾斜

 

注：1.字体倾斜不好看，一般用font-style清除文字的倾斜效果 

（四）行高

1.行高的书写方法

 

2.行高的测量方法

 3.垂直居中

注：1.盒子高度即为height，好像涉及盒子模型 

 （五）字体族

注：1.从左向右依次查找，先找到哪个就用哪个 

 （六）font属性

注：1. 具体设定的属性值可以从京东等网站上复制

2.设置所有字体的初始格式，如果有需要单独设置的字体则单独设置

（七）文本修饰属性 

1.文本缩进

注：1.2em表示首行缩进两个字号大小的距离 

 2.文本对齐

注：1.居中的本质是文字内容居中

3.图片实现居中效果 

 

注：1. 要将属性设置给内容的父级，内容外要套div标签

4.文本修饰线

（八）字体颜色

注：1.其中第二种写法数字越大颜色越深

五.调试工具 

注：1.调试工具在浏览器检查页面中 

本文是对B站上黑马免费课程的总结，供个人学习使用 

相关文章：

HTML第三节

一.初识CSS 1.CSS定义 A.内部样式表 B.外部样式表 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title&g…...

编程日记 2025/3/5 13:13:51

Visual Studio 2022安装问题解决，提示无法安装Microsoft.VisualStudio.Community.Msi

表现现象为&#xff1a;安装完后提示无法安装Microsoft.VisualStudio.Community.Msi&#xff0c;无法正常开发C项目 查看日志&#xff0c;大概显示&#xff1a; xxx ReturnCode1316 xxxxx 消息详细信息: 指定的帐户已存在。 试了网上所有的办法都没用&#xff0c;反复尝试&…...

编程日记 2025/3/5 13:12:49

【代码分享】基于IRM和RRT*的无人机路径规划方法详解与Matlab实现

基于IRM和RRT*的无人机路径规划方法详解与Matlab实现 1. IRM与RRT*的概述及优势 IRM&#xff08;Influence Region Map&#xff09;通过建模障碍物的影响区域&#xff0c;量化环境中的安全风险&#xff0c;为RRT算法提供启发式引导。RRT&#xff08;Rapidly-exploring Random…...

编程日记 2025/3/5 13:11:48

MybatisPlus从入门到精通

一、MyBatis-Plus核心特性 无侵入性 在MyBatis基础上增强&#xff0c;无需修改原有代码即可使用。自动化CRUD 内置通用Mapper和Service&#xff0c;减少80%单表操作代码。Lambda表达式 支持Lambda形式的条件构造&#xff0c;避免字段名硬编码错误。主键策略 支持雪花算法&…...

编程日记 2025/3/5 13:09:44

el-table input textarea 文本域 自适应高度，切换分页滚动失效处理办法

场景&#xff1a; el-table 表格 需要 input类型是 textarea 高度是自适应&#xff0c;第一页数据都是单行数据 不会产生滚动条&#xff0c;但是第二页数据是多行数据 会产生滚动条&#xff0c; bug: 第一页切换到第二页 第二页滚动条无法展示 解决办法&#xff1a;直接修改样…...

编程日记 2025/3/5 13:08:43

基于Windows11的DockerDesktop安装和布署方法简介

基于Windows11的DockerDesktop安装和布署方法简介 一、下载安装Docker docker 下载地址 https://www.docker.com/ Download Docker Desktop 选择Download for Winodws AMD64下载Docker Desktop Installer.exe 双点击 Docker Desktop Installer.exe 进行安装 测试Docker安装是…...

编程日记 2025/3/5 13:07:42

ffmpeg源码编译支持cuda

1.安装cuda CUDA Toolkit 11.3 Downloads | NVIDIA Developer 在选择组件的时候&#xff0c;将CUDA中的Nsight VSE和Visual Studio Integration取消勾选 不然会安装失败 2.编译ffmpeg 把cuda编译宏定义开启&#xff0c;再编译avcodec 3.编译livavutil报错struct "Cuda…...

编程日记 2025/3/5 13:06:41

动漫短剧开发公司，短剧小程序搭建快速上线

在当今快节奏的生活里&#xff0c;人们的娱乐方式愈发多元&#xff0c;而动漫短剧作为新兴娱乐形式&#xff0c;正以独特魅力迅速崛起&#xff0c;成为娱乐市场的耀眼新星。近年来&#xff0c;动漫短剧市场呈爆发式增长&#xff0c;吸引众多创作者与观众目光。 从市场规模来看…...

编程日记 2025/3/5 13:05:39

《2025软件测试工程师面试》接口测试篇

基础概念 什么是接口测试？ 接口测试是测试系统组件间接口的一种测试，主要用于检测外部系统和内部系统之间以及各个子系统之间的交互点。测试的重点是检查数据的交换、传递和控制管理的过程，以及系统间的相互逻辑依赖关系等。 接口测试的优势是什么？ 接口测试具有规范性与扩…...

编程日记 2025/3/5 13:03:37

嵌入式学习第二十三天--网络及TCP

进程通信的方式: 同一主机 传统 system V 不同主机 网络 --- 解决不同主机间 的进程间通信 网络 (通信) //1.物理层面 --- 联通(通路) //卫星 2G 3G 4G 5G 星链 (千帆) //2.逻辑层面 --- 通路(软件) MAC os LINUX …...

编程日记 2025/3/5 13:02:36

Elasticsearch：解锁深度匹配，运用Elasticsearch DSL构建闪电般的高效模糊搜索体验

目录 Elasticsearch查询分类 叶子查询 全文检索查询 match查询 multi_match查询 精确查询 term查询 range查询 复杂查询 bool查询简单应用 bool查询实现排序和分页 bool查询实现高亮 场景分析 问题思考 解决方案 search_after方案(推荐) point in time方案 方案…...

编程日记 2025/3/5 12:59:33

SQLAlchemy系列教程：基本数据类型及自定义类型

在SQLAlchemy、Python SQL工具包和ORM中定义模型时&#xff0c;理解基本数据类型至关重要。本教程提供了在SQLAlchemy模型中有效使用内置基本类型的指南。 SQLAlchemy中的基本类型 SQLAlchemy支持一组与SQL数据库类型一致的基本数据类型。SQLAlchemy中的每种类型都为各种SQL类…...

编程日记 2025/3/5 12:58:32

【Wireshark 02】抓包过滤方法

一、官方教程 Wireshark 官网文档 &#xff1a; Wireshark User’s Guide 二、显示过滤器 2.1、 “数据包列表”窗格的弹出过滤菜单 例如&#xff0c;源ip地址作为过滤选项&#xff0c;右击源ip->prepare as filter-> 选中 点击选中完&#xff0c;显示过滤器&#…...

编程日记 2025/3/5 12:55:27

ES怎么查询大于10000条数据

在Elasticsearch&#xff08;ES&#xff09;中&#xff0c;默认情况下&#xff0c;查询结果的最大返回条数是10,000条。如果你需要查询超过10,000条数据&#xff0c;可以通过以下几种方式来实现&#xff1a; 1. 使用 scroll API scroll API 适用于需要处理大量数据的场景&…...

编程日记 2025/3/5 12:53:25

《几何原本》命题I.8

《几何原本》命题I.8 如果两个三角形有三边对应相等&#xff0c;那么这两个三角形的所有对应角亦相等。 若 A B D E , A C D F , B C E F ABDE,ACDF,BCEF ABDE,ACDF,BCEF 将 △ A B C \triangle ABC △ABC 平移至 △ D E F \triangle DEF △DEF&#xff0c;使 B C BC …...

编程日记 2025/3/5 12:52:24

课程2. 机器学习方法论

课程2. 机器学习方法论 训练算法并评估其质量将样本分成训练和测试。分层 交叉验证方法sklearn 接口算法模型训练模型的应用质量评估 数据预处理标准缩放Violinplot 数据集使用模型Pipeline 在上一讲中&#xff0c;我们讨论了机器学习专家面临的挑战。无论解决的问题类型和解决…...

编程日记 2025/3/5 12:48:20

ioday2-----＞标准io函数

思维导图&#xff1a; 练习&#xff1a; 1将当前的时间写入到time. txt的文件中&#xff0c;如果ctrlc退出之后&#xff0c;在再次执行支持断点续写 1.2022-04-26 19:10:20 2.2022-04-26 19:10:21 3.2022-04-26 19:10:22 //按下ctrlc停止&#xff0c;再次执行程序 4.2022…...

编程日记 2025/3/5 12:47:18

SQL注入练习场：PHPStudy+SQLI-LABS靶场搭建教程（零基础友好版）

注意&#xff1a;文中涉及演示均为模拟测试&#xff0c;切勿用于真实环境&#xff0c;任何未授权测试都是违法行为&#xff01; 一、环境准备 下载PHPStudy 官网下载地址&#xff1a;https://www.xp.cn/php-study&#xff08;选择Windows版&#xff09; 安装时建议选择自定…...

编程日记 2025/3/5 12:46:17

【笔记ing】python

1 Python基础概念及环境搭建 1.1 python简介及发展史 之父Guido van Rossum。ABC语言的替代品。Python提供了高效的数据结构&#xff0c;还能简单有效地面向对象编程。Python语法和动态类型&#xff0c;以及解释性语言的本质&#xff0c;使之成为多数平台上写脚本和快速开发应…...

编程日记 2025/3/5 12:45:16

DFT之SSN架构

SSN&#xff08;Streaming Scan Network&#xff09;架构在DFT&#xff08;设计可测试性&#xff09;中的应用是一种先进的设计测试解决方案&#xff0c;旨在应对现代大规模片上系统&#xff08;SoC&#xff09;设计中的复杂测试挑战。以下是对SSN架构在DFT中应用的详细分析&am…...

编程日记 2025/3/5 12:43:14

centos 7 部署awstats 网站访问检测

一、基础环境准备&#xff08;两种安装方式都要做&#xff09; bash # 安装必要依赖 yum install -y httpd perl mod_perl perl-Time-HiRes perl-DateTime systemctl enable httpd # 设置 Apache 开机自启 systemctl start httpd # 启动 Apache二、安装 AWStats&#xff0…...

编程新知 2026/1/23 8:33:56

dedecms 织梦自定义表单留言增加ajax验证码功能

增加ajax功能模块&#xff0c;用户不点击提交按钮&#xff0c;只要输入框失去焦点&#xff0c;就会提前提示验证码是否正确。 一&#xff0c;模板上增加验证码 <input name"vdcode"id"vdcode" placeholder"请输入验证码" type"text&quo…...

编程新知 2026/2/5 17:51:52

Psychopy音频的使用

Psychopy音频的使用 本文主要解决以下问题&#xff1a; 指定音频引擎与设备&#xff1b;播放音频文件 本文所使用的环境&#xff1a; Python3.10 numpy2.2.6 psychopy2025.1.1 psychtoolbox3.0.19.14 一、音频配置 Psychopy文档链接为Sound - for audio playback — Psy…...

编程新知 2026/1/31 15:09:31

今日科技热点速览

&#x1f525; 今日科技热点速览 &#x1f3ae; 任天堂Switch 2 正式发售 任天堂新一代游戏主机 Switch 2 今日正式上线发售&#xff0c;主打更强图形性能与沉浸式体验&#xff0c;支持多模态交互&#xff0c;受到全球玩家热捧 。 &#x1f916; 人工智能持续突破 DeepSeek-R1&…...

编程新知 2025/11/20 14:26:29

MySQL用户和授权

开放MySQL白名单 可以通过iptables-save命令确认对应客户端ip是否可以访问MySQL服务&#xff1a; test: # iptables-save | grep 3306 -A mp_srv_whitelist -s 172.16.14.102/32 -p tcp -m tcp --dport 3306 -j ACCEPT -A mp_srv_whitelist -s 172.16.4.16/32 -p tcp -m tcp -…...

编程新知 2025/8/25 19:12:45

html-＜abbr＞ 缩写或首字母缩略词

定义与作用 <abbr> 标签用于表示缩写或首字母缩略词&#xff0c;它可以帮助用户更好地理解缩写的含义&#xff0c;尤其是对于那些不熟悉该缩写的用户。 title 属性的内容提供了缩写的详细说明。当用户将鼠标悬停在缩写上时&#xff0c;会显示一个提示框。 示例&#x…...

编程新知 2026/1/24 19:22:03

#Uniapp篇：chrome调试unapp适配

chrome调试设备----使用Android模拟机开发调试移动端页面 Chrome://inspect/#devices MuMu模拟器Edge浏览器&#xff1a;Android原生APP嵌入的H5页面元素定位 chrome://inspect/#devices uniapp单位适配 根路径下 postcss.config.js 需要装这些插件 “postcss”: “^8.5.…...

编程新知 2026/1/4 21:36:42

uniapp 实现腾讯云IM群文件上传下载功能

UniApp 集成腾讯云IM实现群文件上传下载功能全攻略 一、功能背景与技术选型 在团队协作场景中&#xff0c;群文件共享是核心需求之一。本文将介绍如何基于腾讯云IMCOS&#xff0c;在uniapp中实现&#xff1a; 群内文件上传/下载文件元数据管理下载进度追踪跨平台文件预览 二…...

编程新知 2025/9/14 20:44:53

软件工程 期末复习

瀑布模型&#xff1a;计划 螺旋模型&#xff1a;风险低 原型模型: 用户反馈 喷泉模型:代码复用 高内聚 低耦合&#xff1a;模块内部功能紧密 模块之间依赖程度小 高内聚&#xff1a;指的是一个模块内部的功能应该紧密相关。换句话说&#xff0c;一个模块应当只实现单一的功能…...

编程新知 2026/2/7 0:13:47

文件上传漏洞防御全攻略

要全面防范文件上传漏洞&#xff0c;需构建多层防御体系&#xff0c;结合技术验证、存储隔离与权限控制&#xff1a; &#x1f512; 一、基础防护层 前端校验&#xff08;仅辅助&#xff09; 通过JavaScript限制文件后缀名&#xff08;白名单&#xff09;和大小&#xff0c;提…...

编程新知 2025/8/18 19:05:00