首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

表单美化之单选按钮

表单方式

模拟方式

这种方式是什么呢?这种方式是模拟方式,这个时候我们选择:

当我用这个的时候,这个时候有人会问?

你用dl的时候,那么你为什么不用ul和ol,他们其实可以是一样的。没错他们是一样的,很简单的要求叫异化。

写好了之后,出来了之后就会有一个清除样式的文件,叫public.css

第一步:引入public.css

其中public.css为:

这时,其样式会清空,然后展示给大家为:

第二步:写内联样式

首先定个位置:

展示为:

接下来我们是让这些文字横过来:

这里涉及到a标签的问题

然后调整他们之间的位置:

这里涉及到a标签的问题

注意:a标签变成红色,有下划线

为了实现这个效果

需要在前面添加:b标签

当我加了b标签之后,我需要将其变为块级元素,同时看出区域来:

我们为了让其与文字对齐:

然后我们将黑色的位置换成图形

第一个图是没有选中;

第二个图是悬浮在上面;

第三个图是选中;

然后篡位:

然后添加脚本:

最后完成了!!!

  • 发表于:
  • 原文链接http://kuaibao.qq.com/s/20180308G1QDEM00?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券