效果图:

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>CSS3</title>

    <style>

        ul li{list-style:none;float:left;margin-left:20px;margin-top:50px;background:red;text-align: center;}

        .circle1{width:100px;height:50px;border-radius:50px 50px 0 0}

        .circle2{width:50px;height:100px;border-radius: 0 50px 50px 0}

        .circle3{width:100px;height:50px;border-radius:0 0 50px 50px}

        .circle4{width:50px;height:100px;border-radius: 50px 0 0 50px}

        .circle5{width:100px;height:100px;border-radius: 50px}

    </style>

</head>

<body>

    <ul>

        <li class="circle1">上边圆</li>

        <li class="circle2">右边圆</li>

        <li class="circle3">下边圆</li>

        <li class="circle4">左边圆</li>

        <li class="circle5">全圆</li>

    </ul>

</body>

</html>

css实现半圆效果的更多相关文章

  1. css三级菜单效果

    一个简单实用的css三级菜单效果 <!doctype html> <html> <head> <meta charset="utf-8"& ...

  2. 利用target的特性，可以实现纯css的tab效果切换

    基础知识: :target起作用的是href连接到的位置 如 <a href="#tab1">tab1</a> <div id="tab1& ...

  3. 推荐20款基于 jQuery & CSS 的文本效果插件

    jQuery 和 CSS 可以说是设计和开发行业的一次革命.这一切如此简单,快捷的一站式服务.jQuery 允许你在你的网页中添加一些真正令人惊叹的东西而不用付出很大的努力,要感谢那些优秀的 jQue ...

  4. CSS 边框 阴影 效果

    CSS 边框 阴影 效果 以下将css实现阴影效果,以便须要朋友们,直接上代码 #shadow1{ width: 200px; height: 100px; color: white; backgro ...

  5. Css实现透明效果，兼容IE8

    Css实现透明效果,兼容IE8 >>>>>>>>>>>>>>>>>>>>> ...

  6. HTML与CSS简单页面效果实例

    本篇博客实现一个HTML与CSS简单页面效果实例 index.html <!DOCTYPE html> <html> <head> <meta charset ...

  7. css 实现评分效果

    css实现评分效果,其实是css sprites (css精灵)的延伸应用,效果的实现主要是由  background-position 属性移动图片位置.之前看到有前辈写过关于这方面的内容,在理解上 ...

  8. 纯 CSS 实现波浪效果！

    一直以来,使用纯 CSS 实现波浪效果都是十分困难的. 因为实现波浪的曲线需要借助贝塞尔曲线. 而使用纯 CSS 的方式,实现贝塞尔曲线,额,暂时是没有很好的方法. 当然,借助其他力量(SVG.CAN ...

  9. React 系列教程 1：实现 Animate.css 官网效果

    前言 这是 React 系列教程的第一篇,我们将用 React 实现 Animate.css 官网的效果.对于 Animate.css 官网效果是一个非常简单的例子,原代码使用 jQuery 编写,就 ...

随机推荐

  1. 如何使用 PuTTY 远程连接矩池云主机

    PuTTY 是一款开源的连接软件,用来远程连接服务器,支持 SSH.Telnet.Serial 等协议. 矩池云的主机支持 SSH 登录,以下为使用 PuTTY 连接矩池云 GPU 的使用教程. 如您 ...

  2. 如何恢复 iCloud 已删除文件

    原文链接 问题 今天在查找之前的 C++ 笔记时,突然发现之前的资料全没了,整个 Cpp 文件夹内就只剩下了三个文件,怎么形容当时的心情呢,应该说是一下就跌倒了谷底,感觉之前的心血全白费了,有种深深的 ...

  3. Python之VSCode

    在学习Python的过程中,一直没有找到比较趁手的第三方编辑器,用的最多的还是Python自带的编辑器.由于本人用惯了宇宙第一IDE(Visual Studio),所以当Visual Studio C ...

  4. bitsadmin windwos自带下载命令

    bitsadmin的四种下载文件的方法 一. bitsadmin /rawreturn /transfer getfile http://qianxiao996.cn/1.txt c:\1.txt 二 ...

  5. Nginx配置不当（CRLF注入 、目录穿越）

    基于vulhub漏洞环境 环境搭建参考:https://blog.csdn.net/qq_36374896/article/details/84102101 1.漏洞名称 CRLF注入 2.漏洞原理 ...

  6. 论文翻译：2018_Source localization using deep neural networks in a shallow water environment

    论文地址:https://asa.scitation.org/doi/abs/10.1121/1.5036725 深度神经网络在浅水环境中的源定位 摘要: 深度神经网络(DNNs)在表征复杂的非线性关 ...

  7. CyclicBarrier和CountDownLatch区别

    这两天写多线程时,用到了CyclicBarrier,下意识的认为CyclicBarrier和CountDownLatch作用很像,就翻阅资料查了一下,说一下他们的区别吧 CyclicBarrier和C ...

  8. 深入浅出SpringBoot

  9. chrome删除保存的密码

    chrome删除保存的密码 关于谷歌密码管理器 该管理器是将我们的密码管理在google的账号中,当然,谷歌是说用了加密技术保存的,不会存储明文. https://passwords.google.c ...

  10. 你能用Java覆盖静态方法吗？如果我在子类中创建相同的方法是编译时错误？

    不,你不能在Java中覆盖静态方法,但在子类中声明一个完全相同的方法不是编译时错误,这称为隐藏在Java中的方法.你不能覆盖Java中的静态方法,因为方法覆盖基于运行时的动态绑定,静态方法在编译时使用 ...