电脑技术网——专业手机电脑知识平台,关注科技、手机、电脑、智能硬件
HTMLCSSHTML5Bootstrap

用到CSS 给表单必选项去除星号实例交友

2020-10-29 19:38:37 出处:[ 菜菜电脑网 ] 人气:次阅读
在制作网页表单的时候,如果一个选项是必填的,通常就会给选项移除一个星号,下面通过给大家社交应用于CSS 给表单必选项移除星号的付诸方法,必需的朋友参照下吧,期盼能借助到大家。

在制作网页表单的时候,如果一个选项是必填的,通常都会给选项掺入一个星号,比如 Typecho 的评论表单:

<p class="form-group">    <label for="author">姓名</label> <span class="required">*</span>    <input type="text" id="author" name="author" required="required" size="30" class="form-text"></p>

示例:

* 姓名


然后给星号去除一点 CSS 样式:

.form-group span.required {    color: #999;    font-size: 150%;}

例如:

但是有些时候我们可能会无法简化 HTML 结构,或者一定会替换成多余无意义的标签,这时可以利用 CSS 的 after 伪类来制作单单一个星号。

还是上边的表单,移除 <span class="required">*</span> 这段代码,然后替换成 CSS:

.form-group label:after {    content: ' *';    color: #999;    font-size: 150%;}

这样就可以通过 CSS 来制作造出一个代表必选的星号。

其实 CSS 的 before 和 after 伪类是非常好用的,大多数人只是拿它来扫除浮动,其实脑第一道一下,好好利用这两个伪类可以毫无疑问很神秘的事情。

就其自荐:

jQuery发挥作用 RadioButton来作必选校验功能方法体会

PHP中预设参数是不是必须在必选参数之后?

yii替换必填项中星号的方法

以上就是用作CSS 给表单必选项附加星号实例体会的详实内容,更多劝非议php中文网其它系统性文章!

关于我们 - 广告合作 - 联系我们 - 免责声明 - 网站地图 - 投诉建议 - 在线投稿

©CopyRight 2008-2020 caicaipc.com Inc All Rights Reserved.
菜菜电脑网 版权所有 联系QQ:173533152