style
武汉网站建设公司创新互联,武汉网站设计制作，有大型网站制作公司丰富经验。已为武汉数千家提供企业网站建设服务。企业网站搭建\成都外贸网站建设公司要多少钱，请找那个售后服务好的武汉做网站的公司定做！
.yuan{
width:200px;
height:200px;
border-radius:100% 0 0 0;
background:#F00;
}
/style
div class="yuan"/div
是这样的效果吧！
给你个思路：${functon(){
$("*").hover(function(){
function () {
$(this).addClass("你css的class名称");
},
function () {
$(this).removeClass("你css的class名称");
}
});
}}
但是首先你要定义一个给对象添加圆圈背景的css，然后响应的改下值就行了
设置一下边框就可以了。css3的，注意：不兼容低版本ie浏览器
a style="display:inline-block;height:40px;width:40px;line-height:40px;text-align:center;border-radius:50%;" href="#"1/a
!-- 参考： --
很多方法，给你几个常用的
1、圆圈设为div背景，然后把这个div设置padding值来控制文字的位置
2、圆圈设为div背景，然后固定高度和宽度并设置 text-align:center; 再设置文字的行高line-height:与div的高度一样即可
3、圆圈设为div背景，在div内插入span或者a或者其他标签，设置margin属性控制位置；
1、首先打开sublime text编辑器，新建一个html文件，里面写入一个p标签：
2、然后设置p标签的样式，这里先设置一个边框，然后设置圆角边框，主要使用CSS3属性border-radius属性定义圆角效果。其中的数值为参数length是浮点数和单位标识符组成的长度值，不可为负值，这里圆角的值越大，圆角的弧度也越大：
3、最后打开浏览器，就可以看到圆角边框了：
body
div style=" width:50px; height:50px; background-color:#F00; border-radius:25px;"
span style="height:50px; line-height:50px; display:block; color:#FFF; text-align:center"4/span
/div
/body
首先我们需要分析一下整个牌的构造，以普通数字牌1为例，共可分为5个部分，分别是1、外框2、颜色3、上下角标数字4、里面的白色椭圆5、中间的大数字
对应不同的部分，我们将其分解为5部分的html代码并为其添加class，1、卡牌背景2、卡牌颜色（由于布局相同只有颜色不同，故将颜色抽出成为单独的类）3、上下角标数字4、白色椭圆背景5、大数字
以下均采用代码和效果图对比的方式展示效果
布好局之后，为其添加样式。首先新建css样式表，并将其关联至html文件
首先写背景的样式，按牌的比例写出宽高，留白使用padding来写，css3的新特性我们使用了如图的圆角和阴影，为牌制造立体的感觉
然后来写牌的背景颜色，Uno牌一共有黑红黄绿蓝5种颜色，因此我们只需要事先定义好这五种颜色，之后将其对应的类名添加进来就可以了。
另外，因为上下角标的数字需要使用绝对定位，因此它们的父级元素就需要定义为相对定位
下面来写上下角标的数字，由于这里使用的是em行内元素标签，因此设置宽高的时候要记得display：inline-block。
绝对定位到需要的位置，然后将右下角的数字使用css3的旋转函数180度旋转，就可以制造出倒过来的数字了
中间的白色椭圆要怎么画呢，我们知道border-radius的值与宽高相等可以画出圆形，那么当它的值为宽的一半比高的一半时，则可以画出椭圆形，这时我们再将它旋转到合适的角度，就可以得到想要的椭圆
最后就是中间的数字，由于它是椭圆形的子元素，因此椭圆形旋转的时候，它也跟着一起旋转，要想让它摆在一个比较正的位置，还应将它旋转回来。并为它挑选一个合适的字体
至此，我们的普通数字牌已经写好了
