• 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是什么意思

作者:站长图库 字体:[增加 减小] 来源:互联网

站长图库向大家介绍了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,看看怎么绘制自适应的菱形

相关文章

  • 在CSS中怎么给按钮添加背景图片(详解及实例)
  • 5款优秀的在线表单设计器
  • 如何去除PS渐变时存在色阶问题
  • PHPCMS如何判断该栏目是否含有子栏目?
  • 如何快速搭建uni-app项目?两种搭建方法分享
  • 分享实现PHP红包算法的思路(附开发代码)
  • Photoshop制作针织毛绒文字效果
  • 织梦dedecms会员中心模板带会员签到赚金币功能
  • sql语句中创建表的语句是什么
  • Elasticsearch工具cerebro的安装与使用教程

文章分类

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

最近更新的内容

    • 分享几种实用的Node.js调试方法,快来收藏吧!!
    • 教你使用PHP数据库迁移工具“Phinx”
    • 帝国cms中常用标签(总结)
    • CSS3如何实现图片木桶布局?(附代码)
    • Linux下使用NTFS文件系统(Linux挂载NTFS数据盘)
    • Phpstudy:80或者3306端口占用解决方案
    • 实现在dedecms模板中调用wordpress的文章方法
    • Illustrator设计个性时尚风格的名片教程
    • DEDECMS获取本文地址标签
    • YII如何将对象转化为数组或直接输出为json格式

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

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