• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • dedecms
  • ecshop
  • z-blog
  • UcHome
  • UCenter
  • drupal
  • WordPress
  • 帝国cms
  • phpcms
  • 动易cms
  • phpwind
  • discuz
  • 科汛cms
  • 风讯cms
  • 建站教程
  • 运营技巧
您的位置:首页 > CMS教程 >建站教程 > html中circle是什么意思

html中circle是什么意思

作者:站长图库 字体:[增加 减小] 来源:互联网 时间:2022-04-29

站长图库向大家介绍了html,circle是什么意思等相关知识,希望对您有所帮助

在html中,circle的意思是圆,用于指定某种基本图形类型,只需要给元素设置“circle(数值)”即可。这个函数创建一个圆形区域来屏蔽它所应用的元素,可以指定它的半径和位置,通常与图像一起使用来创建圆角形状。


html中circle是什么意思


CSS circle()函数是一个图形函数,用于指定某种基本图形<basic-shape>类型。

CSS <basic-shape>代表一种基本图形,它通过图形函数来定义一个图形。一个基本图形可以作为shape-outside属性,或clip-path属性的参数使用,经这些属性应用在一个元素上,可以使这个元素周围的内容环绕在它的周围,或者使用指定的图形来剪裁内容。

circle()函数的语法如下:

circle() = circle( [<shape-radius>]? [at <position>]? )/* where.. */<shape-radius> = <length> | <percentage> | closest-side | farthest-side

circle()函数用于定义一个圆形。它的参数都是可选参数,如果第一个参数缺省,则由浏览器来决定它的默认值。

如果第二个参数position缺省,那么圆形的圆心位于使用该函数的元素的中心位置。设置position参数的语法和background-position相同。使用position是必须带有at关键字。

<shape-radius>参数用于指定圆形的半径。如果是百分比值则使用参考盒模型的宽度和高度来计算。不允许为负数。

除了使用长度值和百分比值来指定圆形的半径,也可以使用两个关键字来指定:closest-side和furthest-side。closest-side关键字表示,如果你没有指定圆形的半径,那么浏览器将使用元素的最接近圆心的边到圆心的距离作为半径。如下图所示。furthest-side和closest-side刚好相反,它使用距离最远的边到圆心的距离作为半径。

html中circle是什么意思

下面都是有效的circle()函数声明。

circle();/* 使用默认值:圆形使用closest-side作为半径,圆形位于元素的中心 */  circle(100px at 30% 50%);/* 圆形的半径为100像素,位于元素的水平30%,垂直50%的位置 */  circle(farthest-side at 25% 25%);/* 圆形的半径为最远边的一半,位于元素的水平25%,垂直25%的地方 */  circle(10em at 500px 300px);


分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • HTML5 canvas如何绘制酷炫能量线条效果(附代码)
  • 利用html实现进度条效果的方法
  • 手把手教你在html中引入另一个html文件的方法(详解)
  • PHP过滤HTML标签代码方法
  • html中circle是什么意思
  • php如何将html转为图片
  • 百度编辑器上传word文件转为html
  • 使用HTML5开发App有哪些优缺点
  • php htmlentities 乱码怎么办
  • 带你了解HTML5 SVG,看看怎么绘制自适应的菱形

相关文章

  • 2022-04-29JavaScript事件之事件冒泡与时间捕获(总结分享)
  • 2022-04-29TP框架如何实现163或QQ邮件的收发
  • 2022-04-29不得不注意的网站描述优化问题
  • 2022-04-29帝国cms中常用标签(总结)
  • 2022-04-29掌握PHP删除数组中的空值的小技巧
  • 2022-04-29WordPress调用站外文章解决方法
  • 2022-04-29VUE中怎么导出excel文件?
  • 2022-04-29PHP怎么将图片转成base64
  • 2022-04-29Thinkphp6中怎么封装优化api数据格式
  • 2022-04-29CSS实现领积分动画效果

文章分类

  • dedecms
  • ecshop
  • z-blog
  • UcHome
  • UCenter
  • drupal
  • WordPress
  • 帝国cms
  • phpcms
  • 动易cms
  • phpwind
  • discuz
  • 科汛cms
  • 风讯cms
  • 建站教程
  • 运营技巧

最近更新的内容

    • 浅析Vue中的Vue.set和this.$set,看看使用场景!
    • CDR制作漂亮圣诞海报
    • CorelDRAW实例教程:绘制创意风格的游戏海报教程
    • 织梦DedeCMS V5.7前台搜索打开慢的原因及解决方法
    • 做百度知道推广的一点小经验
    • Photoshop制作非常大气的金色立体字
    • 一起聊聊PHP中return语句的作用和echo的区别(详解及实例)
    • PHP如何将图片上传并替换?
    • 网站地图设计的五个技巧
    • Photoshop利用通道及滤镜制作放射光束

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有