【前端】CSS基础(4)

文章目录

  • 前言
  • 1、CSS常用属性
    • 1.1 文本属性
      • 1.1.1 文本对齐
      • 1.1.2 文本装饰
      • 1.1.3 文本缩进
      • 1.1.5 行高

前言

  • 这篇博客仅仅是对CSS的基本结构进行了一些说明,关于CSS的更多讲解以及HTML、Javascript部分的讲解可以关注一下下面的专栏,会持续更新的。
    链接: Web前端学习专栏

  • 下面我对这个专栏的内容进行几点说明:

    1. 适合每一个前端0基础的小伙伴学习。
    2. 对常用标签以及常用属性进行了详细讲解。
    3. 最后有综合案例实现,手把手带大家实现每一个综合案例。
    4. 可以把专栏当作查询资料,前端的知识忘记了的话可以根据博客的目录找到相对应的内容进行复习。
  • 首先,提示一下大家,如果是在手机端看这篇博客的小伙伴,请移步电脑端学习哈!在电脑上会更好看一些!如果能够跟着在电脑上进行代码的实现就会更好了!
    在这里插入图片描述

  • 其次,欢迎大家来到前端的学习,因为我们可以很直观的看见代码的效果,所以我觉得前端的学习其实是很有意思的。这篇博客,将帮助您从零开始学习前端。

  • 在这个学习过程中,将遇到挑战和困难,但请相信,每一次的努力和坚持都将化为成长的动力。让我们携手共进,一起探索Web前端的无限可能!

1、CSS常用属性

1.1 文本属性

1.1.1 文本对齐

控制文字水平方向的对齐。
不仅能控制文本对齐,也能控制图片等元素居中或者靠右。

text-align: [值];

center:居中对齐。
left: 左对齐。
right:右对齐。

代码:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><h1>靠左</h1><h2>居中</h2><h3>靠右</h3>
</body>
</html>

浏览器显示如下:
在这里插入图片描述

现在我们有一个要求:让靠左的文字处于页面左方;居中的文字处于页面中间;靠右的文字处于页面右方。

代码:

<!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>h1 {text-align: left;}h2 {text-align: center;}h3 {text-align: right;}</style>
</head>
<body><h1>靠左</h1><h2>居中</h2><h3>靠右</h3>
</body>
</html>

浏览器显示如下:
在这里插入图片描述

1.1.2 文本装饰

text-decoration: [值];

常用取值:

  1. underline 下划线(常用)。
  2. none 啥都没有,可以给a标签去掉下划线。
  3. overline上划线(不常用)。
  4. line-through 删除线(不常用)。

代码:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?</p>
</body>
</html>

浏览器显示如下:
在这里插入图片描述

要求:给文本文字加上下划线。

代码:

<!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>p {text-decoration: underline;}</style>
</head>
<body><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?</p>
</body>
</html>

浏览器显示如下:
在这里插入图片描述

要求:给文本文字加上中划线。

代码:

<!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>p {text-decoration: line-through;}</style>
</head>
<body><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?</p>
</body>
</html>

浏览器显示如下:
在这里插入图片描述

要求:给文本文字加上上划线。

代码:

<!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>p {text-decoration: overline;}</style>
</head>
<body><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?</p>
</body>
</html>

浏览器显示如下:
在这里插入图片描述
还记得我们在上一篇博客中说过去掉超链接文字的下划线吗?我们就可以利用这里的知识来实现。

代码:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><a href="#">不跳转</a>
</body>
</html>

浏览器显示如下:
在这里插入图片描述

这是原来的展示效果,下面我们来修改一下。

代码:

<!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>a {text-decoration: none;}</style>
</head>
<body><a href="#">不跳转</a>
</body>
</html>

浏览器显示如下:
在这里插入图片描述

1.1.3 文本缩进

控制段落的首行缩进()其他行不影响。

text-indent: [值];

1.单位可以使用px或者em.
2. 使用em作为单位更好,1个em就是当前元素的文字大小。
3. 缩进可以是负的,表示往左缩进(会导致文字溢出去)。

代码:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?</p>
</body>
</html>

浏览器显示如下:
在这里插入图片描述

要求:文本首行缩进20px。

第一种:

代码:

<!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>p {text-indent: 20px;}</style>
</head>
<body><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?</p>
</body>
</html>

浏览器显示如下:
在这里插入图片描述
第二种方式:
代码:

<!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>p {text-indent: 2em;}</style>
</head>
<body><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?</p>
</body>
</html>

浏览器显示如下:
在这里插入图片描述

1.1.5 行高

行高指的是上下文本行之间的基线距离。

HTML中展示文字涉及到这几个基准线:

在这里插入图片描述

  1. 绿色的是顶线。
  2. 蓝色的是中线。
  3. 红色的是基线。
  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>
</head>
<body><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?</p>
</body>
</html>

浏览器显示如下:
在这里插入图片描述

我们接下来设置一下行高,使行与行之间的距离变得更大些。

代码:

<!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>p {line-height: 200px;}</style>
</head>
<body><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam enim obcaecati a nobis error cupiditate nam voluptate velit deserunt quibusdam accusantium iste eligendi eius porro dolore, excepturi, aut quia itaque?</p>
</body>
</html>

浏览器显示如下:
在这里插入图片描述

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

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

相关文章

golang http请求返回 io.ReadCloser 数据读取和编码转换为utf8 注意事项

在go语言中我们发送一个http请求后&#xff0c; 我们需要通过resp返回体中的Body对象&#xff08;是一个 io.ReadCloser对象&#xff09;来对请求返回的数据进行读取。 对于这类Reader的数据读取我们需要先定义一个byte切片, 然后通过循环来对reader中的数据进行读取&#xff…

Day_5

1. Apache ECharts Apache ECharts 是一款基于 Javascript 的数据可视化图表库&#xff0c;提供直观&#xff0c;生动&#xff0c;可交互&#xff0c;可个性化定制的数据可视化图表 官网地址&#xff1a;https://echarts.apache.org/zh/index.html 入门案例 快速入门&#x…

记录一下-排查免密登录过程

过程记录 2024-05-15 18:15:15 在本地机器上生成新的密钥对&#xff1a; ssh-keygen -t rsa -b 2048 -m PEM -f ~/.ssh/id_rsa_new2024-05-15 18:25:37 将新生成的公钥复制到服务器&#xff1a; ssh-copy-id -i ~/.ssh/id_rsa_new.pub xaykt10.24.17.52024-05-15 18:10:58 执…

企业计算机服务器中了faust勒索病毒如何处理,faust勒索病毒解密恢复

随着网络技术的不断发展与应用&#xff0c;越来越多的企业利用网络走向了数字化办公模式&#xff0c;网络也极大地方便了企业生产运营&#xff0c;大大提高了企业生产效率&#xff0c;但对于众多企业来说&#xff0c;企业的数据安全一直是大家关心的主要话题&#xff0c;保护好…

fastjson2使用

说明&#xff1a;fastjson2是一个性能极致并且简单易用的Java JSON库&#xff08;官方语&#xff09;&#xff0c;本文介绍在Spring Boot项目中如何使用fastjson2。 创建项目 首先&#xff0c;创建一个Maven项目&#xff0c;引入fastjson2依赖&#xff0c;如下&#xff1a; …

战网国际服注册教程 暴雪战网国际服账号注册一站式教程分享

战网国际版&#xff0c;也即Battle.net环球版&#xff0c;是由暴雪娱乐操刀的全球化游戏交流枢纽&#xff0c;它突破地理限制&#xff0c;拥抱全世界的游戏玩家。与仅限特定地区的版本不同&#xff0c;国际版为玩家开辟了无障碍通道&#xff0c;让他们得以自由探索暴雪庞大游戏…

Python使用fastdfs-client与FastDFS交互

1. 安装&#xff08;要求Python3.10&#xff09; pip install fastdfs-client 注&#xff1a;Python3.8和Python3.9可以用这个GitHub - waketzheng/fastdfs-client-python at 1.0.1 2. 使用 from pathlib import Path from fastdfs_client import FastdfsClientclient Fas…

如何使用JMeter测试导入接口/导出接口?

&#x1f345; 视频学习&#xff1a;文末有免费的配套视频可观看 &#x1f345; 关注公众号&#xff1a;互联网杂货铺&#xff0c;回复1 &#xff0c;免费获取软件测试全套资料&#xff0c;资料在手&#xff0c;涨薪更快 今天上班&#xff0c;被开发问了一个问题&#xff1a;JM…

opencv 轮廓区域检测

直线检测 void LineDetect(const cv::Mat &binaryImage) {cv::Mat xImage,yImage,binaryImage1,binaryImage2;// 形态学变化&#xff0c;闭操作 先膨胀&#xff0c;再腐蚀 可以填充小洞&#xff0c;填充小的噪点cv::Mat element cv::getStructuringElement(cv::MORPH_RE…

最小质数对-第12届蓝桥杯国赛Python真题解析

[导读]&#xff1a;超平老师的Scratch蓝桥杯真题解读系列在推出之后&#xff0c;受到了广大老师和家长的好评&#xff0c;非常感谢各位的认可和厚爱。作为回馈&#xff0c;超平老师计划推出《Python蓝桥杯真题解析100讲》&#xff0c;这是解读系列的第63讲。 最小质数对&#…

Flutter 中的 Icon 小部件:全面指南

Flutter 中的 Icon 小部件&#xff1a;全面指南 Flutter 提供了多种方式来展示图标&#xff0c;其中 Icon 是最常用的小部件之一。它不仅用于展示简单的图标&#xff0c;还可以与文本、按钮和其他小部件组合使用&#xff0c;以增强用户界面的交互性。本篇文章将详细介绍 Icon …

Windows内核函数 - ANSI_STRING字符串与UNICODE_STRING字符串

DDK不鼓励程序员使用C语言的字符串&#xff0c;主要是因为&#xff1a;标准C的字符串处理函数容易导致缓冲区溢出等错误。如果程序员不对字符串的长度进行检查&#xff0c;很容易导致这个错误&#xff0c;从而导致整个操作系统的崩溃。DDK鼓励程序员使用DDK自定义的字符串&…

基于SSM的“羽毛球馆管理系统”的设计与实现(源码+数据库+文档)

基于SSM的“羽毛球馆管理系统”的设计与实现&#xff08;源码数据库文档) 开发语言&#xff1a;Java 数据库&#xff1a;MySQL 技术&#xff1a;SSM 工具&#xff1a;IDEA/Ecilpse、Navicat、Maven 系统展示 系统结构图 登录界面 后台用户添加 后台用户管理 球场添加 球场…

英特尔处理器-----ERMS

ERMS&#xff0c;全称为Enhanced REP MOVSB/STOSB&#xff0c;是英特尔处理器的一种特性。它增强了使用REP MOVSB和REP STOSB指令进行内存操作的效率 section .datasrc db Hello,World! ; 源数据dst times 12 db 0 ; 目标缓冲区section .textglobal _start _start:mov es…

vj题单 Color the ball c 差分

题目链接&#xff1a;Problem - 1556 (hdu.edu.cn) 笔者思路&#xff1a;利用一维差分数组进行区间同时1的操作&#xff0c;然后还原为一维前缀和数组 笔者答案&#xff1a; #include<stdio.h> int cut[100010];int main() {long N,a,b,i,k1,j;scanf("%ld",…

Leetcode 3148. Maximum Difference Score in a Grid

Leetcode 3148. Maximum Difference Score in a Grid 1. 解题思路2. 代码实现 题目链接&#xff1a;3148. Maximum Difference Score in a Grid 1. 解题思路 这一题的话算是一个脑筋急转弯的题目吧&#xff0c;本质上就是求各个坐标下其右下方矩阵当中除自己外最大的元素是多…

Linux 第三十三章

&#x1f436;博主主页&#xff1a;ᰔᩚ. 一怀明月ꦿ ❤️‍&#x1f525;专栏系列&#xff1a;线性代数&#xff0c;C初学者入门训练&#xff0c;题解C&#xff0c;C的使用文章&#xff0c;「初学」C&#xff0c;linux &#x1f525;座右铭&#xff1a;“不要等到什么都没有了…

大模型学习笔记九:模型微调

文章目录 一、什么时候需要Fine-Tuning二、用Hugging Face根据电影评论输出来对电影进行情感分类1)安装依赖2)操作流程3)名字解释4)代码导入库和加载模型、加载数据库、加载tokenlizer5)其他相关公共变量赋值(随机种子、标签集评价、标签转token_Id)6)处理数据集:转成…

Altium Designer封装库和元器件符号库下载与导入教程(SnapEDA 、Ultra Librarian、Alldatasheetcn)

1.AD封装库和元器件符号库下载网址 以下是一些全球热门的Altium Designer封装库和元器件符号库下载网址推荐&#xff1a; Altium Content Vault (现称为Altium Manufacturer Part Search)&#xff1a;这是Altium官方提供的元器件库&#xff0c;可以直接在Altium Designer中使用…

免费体验GPT-4o这5大功能,非常好用!

这几天&#xff0c;OpenAI发布了新的GPT版本&#xff0c;GPT-4o&#xff0c;比GPT4更加智能也更快。 据说&#xff0c;GPT-4o在文本、推理和编码智能方面实现了GPT-4 Turbo级别的性能&#xff0c;在多语言、文本、音频和视觉功能方面甚至超过了市面上所有同类产品。 有几个亮点…