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

CSS笔记（黑马程序员pink老师前端）圆角边框

news 2026/2/3 23:51:14

圆角边框

border-radius:length;

效果显示
在这里插入图片描述

<!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><style>* {margin: 0;padding: 0;}div {display: inline-block;margin-top: 20px;margin-left: 30px;background-color: pink;}.div1 {/* 圆角边框,用半径为10px的圆,切原有的矩形 */border-radius: 10px;height: 100px;width: 200px;}.div2 {/* border-radius的值也可为百分比,当切角圆的半径为正方形的一半时,显示为圆形 */border-radius: 50%;height: 100px;width: 100px;}.div3 {/*圆的半径为高度的一半 */border-radius: 60px;height: 100px;width: 200px;}.div4 {/*依次设置不同的角 */border-radius: 10px 20px 40px 80px;height: 100px;width: 200px;}.div5 {/*只有两个值,为对角线关系 */border-radius: 40px 10px;height: 100px;width: 200px;}.div6 {/*单独设一个角,top与left的顺序不能变 */border-top-left-radius: 20px;height: 100px;width: 200px;}
</style><body><div class="div1"></div><div class="div2"></div><div class="div3"></div><div class="div4"></div><div class="div5"></div><div class="div6"></div>
</body></html>

相关文章：

CSS笔记（黑马程序员pink老师前端）圆角边框

圆角边框 border-radius:length; 效果显示 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>Documen…...

编程日记 2023/9/10 12:08:30

水表电表集中远程抄表系统分析

电表水表远程抄表系统石家庄光大远通电气有限公司主要经营自动抄表,远程抄表,集中抄表,新供应信息&#xff0c;是石家庄光大远通电气有限公司自动远程抄表系统集信号采集、网络通信于一体的高性能抄表装置&#xff0c;该系统以485通讯方式读取水表电表的数据,以MBUS通讯方式读取…...

编程日记 2023/9/10 12:07:29

Android 通知

1. 原生Android通知的几种显示方式&#xff1a; 状态栏的图标&#xff1a;发出通知后&#xff0c;通知会先以图标的形式显示在状态栏中。 抽屉式通知栏&#xff1a;用户可以在状态栏向下滑动以打开抽屉式通知栏&#xff0c;并在其中查看更多详情及对通知执行操作。在应用或用户…...

编程日记 2023/9/10 12:06:28

【Unittest】Requests实现小程序项目接口测试

文章目录 一、搭建接口测试框架二、初始化日志三、定义全局变量四、封装接口五、编写测试用例六、生成测试报告 一、搭建接口测试框架 目录结构如下。 二、初始化日志 在utils.py文件中编写如下如下代码&#xff0c;初始化日志。 # 导入app.py全局变量文件 import app import l…...

编程日记 2023/9/10 12:05:27

Mac 搭建本地服务器

文章目录 一、启动服务器二、添加文件到本地服务三、手机/其他电脑 访问本机服务器 MacOS 自带Apatch 服务器。所以我这里选择Apatch服务器搭建 一、启动服务器 在safari中输入 http://127.0.0.1/ &#xff0c;如果页面出现 it works&#xff0c;则代表访问成功。启动服务器 …...

编程日记 2023/9/10 12:04:26

区块链基础之编写合约二

一、了解solidity中的关键字。 二、了解solidity中的类型。 三、编写合约 1.这里列出一些solidity中的关键字&#xff0c;有哪些。 pragma 作用&#xff1a;是告知编译器如何处理源代码的通用指令&#xff08;例如&#xff0c; pragma once &#xff09;。public 作用&#…...

编程日记 2023/9/10 12:03:25

【前端基础】js 如何判断一个值是数组

在JavaScript中&#xff0c;可使用不同的方法来判断一个值是否是一个数组。以下是一些常用的方法&#xff1a; 使用 Array.isArray() 方法&#xff1a; if (Array.isArray(value)) {// 值是一个数组 } else {// 值不是一个数组 }Array.isArray() 方法是最简单和推荐的方法&…...

编程日记 2023/9/10 12:02:23

Linux之NFS服务器

目录 Linux之NFS服务器 简介 NFS背景介绍 生产应用场景 NFS工作原理 NFS工作流程图 流程 NFS的安装 安装nfs服务 安装rpc服务 启动rpcbind服务同时设置开机自启动 启动nfs服务同时设置开机自启动 NFS的配置文件 主配置文件分析 示例 案例 --- 建立NFS服务器&#…...

编程日记 2023/9/10 12:01:22

ES delete_by_query条件删除的几种方式

es 查询删除的几种方式 1.根据id删除 #根据id删除 POST /indexname/_delete_by_query {"query": { "match": {"id": "100000"}} } 2.根据多个id删除 #根据多个id删除 POST /indexname/_delete_by_query {"query": {"…...

编程日记 2023/9/10 12:00:20

1.springboot 集成elasticsearch组件

1.前置条件已经安装和搭建好了elasticsearch中间件 一&#xff1a;项目中引入elasticsearch相关依赖 我安装的elasticsearch版本是7.10.2 对应依赖的版本保持一致 此处省略springboot 搭建及必要的依赖项 <dependency><groupId>org.elasticsearch.client</group…...

编程日记 2023/9/10 11:59:19

【学习笔记】元学习如何解决计算机视觉少样本学习的问题？

目录 1 计算机视觉少样本学习 2 元学习 3 寻找最优初始参数值方法&#xff1a;MAML 3.1 算法步骤 3.2 代码&#xff1a;使用MAML 和 FO-MAML、任务增强完成Few-shot Classification 4 距离度量方法&#xff1a;Siamese Network,ProtoNet,RN 4.1 孪生网络&#xff08;Sia…...

编程日记 2023/9/10 11:58:18

【C语言】17-函数-3

1. 链接属性 当组成一个程序的各个源文件分别被编译之后，所有的目标文件以及那些从一个或多个函数库中引用的函数将链接在一起，形成可执行程序。然而，如果相同的标识符出现在几个不同的源文件中时，它们是表示同一个实体，还是表示不同的实体？标识符的链接属性决定如何处理…...

编程日记 2023/9/10 11:57:17

人工智能：为你提供的未来工作岗位

随着科技的快速发展&#xff0c;人工智能(Artificial Intelligence,AI)正逐渐渗透到各个领域。本文探讨一下人工智能可以提供的工作岗位&#xff0c;以期帮助大家更好地了解这个新兴行业的就业前景。 文章目录 1 机器学习工程师2 数据科学家3 自然语言处理工程师4 机器视觉工程…...

编程日记 2023/9/10 11:56:16

HashMap、LinkedHashMap、ConcurrentHashMap、ArrayList、LinkedList的底层实现。

HashMap、LinkedHashMap、ConcurrentHashMap、ArrayList、LinkedList的底层实现。 HashMap相关问题 1、你用过HashMap吗&#xff1f;什么是HashMap&#xff1f;你为什么用到它&#xff1f;用过&#xff0c;HashMap是基于哈希表的Map接口的非同步实现&#xff0c; 它允许null键…...

编程日记 2023/9/10 11:55:15

flink学习之广播流与合流操作demo

广播流是什么&#xff1f; 将一条数据广播到所有的节点。使用 dataStream.broadCast() 广播流使用场景&#xff1f; 一般用于动态加载配置项。比如lol&#xff0c;每天不断有人再投诉举报&#xff0c;客服根本忙不过来&#xff0c;腾讯内部做了一个判断&#xff0c;只有vip3…...

编程日记 2023/9/10 11:54:13

PPT架构师架构技能图

PPT架构师架构技能图 目录概述需求&#xff1a; 设计思路实现思路分析1.软素质2.核心输出&#xff08;office输出&#xff09; 参考资料和推荐阅读 Survive by day and develop by night. talk for import biz , show your perfect code,full busy&#xff0c;skip hardness,ma…...

编程日记 2023/9/10 11:53:11

STM32微控制器的低功耗模式

STM32微控制器的低功耗模式（Low-power modes）：Sleep mode、Stop mode 和 Standby mode。 1.1 Sleep Mode（睡眠模式）： 把STM32微控制器当作一位劳累的工人，他在工作过程中需要短暂的休息。在Sleep模式下，微控制器会关闭一部分电路，减小功耗，但仍然保持对中央处理单…...

编程日记 2023/9/10 11:52:10

tensorflow QAT

tensorflow qat https://www.wpgdadatong.com/tw/blog/detail/70672 在边缘运算的重点技术之中&#xff0c;除了简化复杂的模块构架&#xff0c;来简化参数量以提高运算速度的这项模块轻量化网络构架技术之外。另一项技术就是各家神经网络框架&#xff08;TensorFlow、Pytorc…...

编程日记 2023/9/10 11:51:09

[杂谈]-快速了解LoRaWAN网络以及工作原理

快速了解LoRaWAN网络以及工作原理 文章目录 快速了解LoRaWAN网络以及工作原理1、LoRaWAN网络元素1.1 终端设备&#xff08;End Devices&#xff09;1.2 网关&#xff08;Gateways&#xff09;1.3 网络服务器&#xff08;Net Server&#xff09;1.4 应用服务器&#xff08;Appli…...

编程日记 2023/9/10 11:50:07

MySQL--MySQL表的增删改查（基础）

排序&#xff1a;ORDER BY 语法&#xff1a; – ASC 为升序&#xff08;从小到大&#xff09; – DESC 为降序&#xff08;从大到小&#xff09; – 默认为 ASC SELECT … FROM table_name [WHERE …] ORDER BY column [ASC|DESC], […]; *** update...

编程日记 2023/9/10 11:49:06

Leetcode 3576. Transform Array to All Equal Elements

Leetcode 3576. Transform Array to All Equal Elements 1. 解题思路2. 代码实现 题目链接&#xff1a;3576. Transform Array to All Equal Elements 1. 解题思路 这一题思路上就是分别考察一下是否能将其转化为全1或者全-1数组即可。 至于每一种情况是否可以达到&#xf…...

编程新知 2025/9/17 7:25:07

React hook之useRef

React useRef 详解 useRef 是 React 提供的一个 Hook&#xff0c;用于在函数组件中创建可变的引用对象。它在 React 开发中有多种重要用途&#xff0c;下面我将全面详细地介绍它的特性和用法。 基本概念 1. 创建 ref const refContainer useRef(initialValue);initialValu…...

编程新知 2025/6/11 15:21:26

论文解读：交大港大上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架（一）

宇树机器人多姿态起立控制强化学习框架论文解析 论文解读&#xff1a;交大&港大&上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架&#xff08;一&#xff09; 论文解读&#xff1a;交大&港大&上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化…...

编程新知 2025/8/27 0:58:09

什么是EULA和DPA

文章目录 EULA&#xff08;End User License Agreement&#xff09;DPA&#xff08;Data Protection Agreement&#xff09;一、定义与背景二、核心内容三、法律效力与责任四、实际应用与意义 EULA&#xff08;End User License Agreement&#xff09; 定义&#xff1a; EULA即…...

编程新知 2025/10/18 7:13:10

工业自动化时代的精准装配革新：迁移科技3D视觉系统如何重塑机器人定位装配

AI3D视觉的工业赋能者 迁移科技成立于2017年&#xff0c;作为行业领先的3D工业相机及视觉系统供应商&#xff0c;累计完成数亿元融资。其核心技术覆盖硬件设计、算法优化及软件集成&#xff0c;通过稳定、易用、高回报的AI3D视觉系统&#xff0c;为汽车、新能源、金属制造等行…...

编程新知 2025/11/25 4:59:47

是否存在路径（FIFOBB算法）

题目描述 一个具有 n 个顶点e条边的无向图&#xff0c;该图顶点的编号依次为0到n-1且不存在顶点与自身相连的边。请使用FIFOBB算法编写程序&#xff0c;确定是否存在从顶点 source到顶点 destination的路径。 输入 第一行两个整数&#xff0c;分别表示n 和 e 的值&#xff08;1…...

编程新知 2025/10/1 6:09:21

【VLNs篇】07：NavRL—在动态环境中学习安全飞行

项目内容论文标题NavRL: 在动态环境中学习安全飞行 (NavRL: Learning Safe Flight in Dynamic Environments)核心问题解决无人机在包含静态和动态障碍物的复杂环境中进行安全、高效自主导航的挑战&#xff0c;克服传统方法和现有强化学习方法的局限性。核心算法基于近端策略优化…...

编程新知 2026/1/24 15:09:43

Git 3天2K星标：Datawhale 的 Happy-LLM 项目介绍（附教程）

引言 在人工智能飞速发展的今天&#xff0c;大语言模型&#xff08;Large Language Models, LLMs&#xff09;已成为技术领域的焦点。从智能写作到代码生成&#xff0c;LLM 的应用场景不断扩展&#xff0c;深刻改变了我们的工作和生活方式。然而&#xff0c;理解这些模型的内部…...

编程新知 2026/1/29 11:06:33

c++第七天 继承与派生2

这一篇文章主要内容是 派生类构造函数与析构函数 在派生类中重写基类成员 以及多继承 第一部分&#xff1a;派生类构造函数与析构函数 当创建一个派生类对象时&#xff0c;基类成员是如何初始化的&#xff1f; 1.当派生类对象创建的时候&#xff0c;基类成员的初始化顺序 …...

编程新知 2026/2/2 21:55:02

Golang——7、包与接口详解

包与接口详解 1、Golang包详解1.1、Golang中包的定义和介绍1.2、Golang包管理工具go mod1.3、Golang中自定义包1.4、Golang中使用第三包1.5、init函数 2、接口详解2.1、接口的定义2.2、空接口2.3、类型断言2.4、结构体值接收者和指针接收者实现接口的区别2.5、一个结构体实现多…...

编程新知 2026/2/2 16:55:46