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

CSS有趣知识

4.圆角边框
在CSS3中,新增了圆角边框样式,这样我们的盒子就可以变圆角了。
border-radius 属性用于设置元素的外边框圆角。
语法:
border-radius:length;
radius 半径(圆的半径)原理:(椭圆)与边框的交集形成圆角效果
1.参数值可以为数值或百分比的形式
2.如果是正方形,想要设置为一个圆,把数值修改为高度或者宽度的一半即可,或者直接写为50%
3.如果是个矩形,设置为高度的一半就可以做
4.该属性是一个简写属性,可以跟四个值,分别代表左上角,右上角、右下角、左下角。
5.分开写:border-top-ldft-radius、border-top-right-radius、border-bottom-right-radius和border-bottom-left-radius
5.盒子阴影
CSS3中新增了盒子阴影,我们可以使用box-shadow属性为盒子添加阴影。
语法:
box-shadow: h-shadow v-shadow blur spread color inset;

注意:
1、默认的是外阴影(outset),但是不可以鞋这个单词,否则导致阴影无效
2、盒子阴影不占用空间,不会影响其他盒子排列。
6.文字阴影
在css3中,我们可以使用text-shadow属性将阴影应用于文本。


http://www.mrgr.cn/news/2651.html

相关文章:

  • JS面试题3
  • Redis三个版本(3.x,4.x,6.x)对于多线程的使用比对
  • 如何克服编程学习中的挫折感的?
  • redis列表若干记录
  • LeetCode-轮转数组
  • 如何培养单元测试的习惯?怎样才算一个好的单元测试?
  • Hexo通过GitHub设置自定义域名
  • Eureka 原理与实践全攻略
  • Android更改包名和签名
  • An error occurred: module ‘openai‘ has no attribute ‘ChatCompletion‘
  • 百度地图SDK Android版开发 7 覆盖物示例1
  • Flask 线上高并发部署方案实现
  • 2024.08.13 校招 实习 内推 面经
  • 周易测算系统开发:融合古典智慧与现代技术的创新实践
  • ShareSDK Twitter
  • SpringSecurity6
  • 运维学习————nginx2-配置详解及负载均衡
  • C#使用Modbus TCP通讯PLC,实现读写寄存器
  • 【css】水平对齐方式(justify、text-align、display: flex;)
  • 响应式Web设计:纯HTML和CSS的实现技巧-2