zoukankan      html  css  js  c++  java
  • 通过CSS 给界面必选项添加星号

            在制作网页的时候,如果一个选项是必填的,通常会给选项添加一个红色星号,来引起用户的注意;最近笔者刚好遇见一个类似的需求,本来可以用html标签和style就可搞定,由于笔者需要改动的界面比较多(六个);好不容易将这些界面改完收工后,同事也在修改这几个界面,发现这个样式多处用到,而且笔者处理的方案一样代码重复率比较高,就建议笔者将这块功能提取出来作为公共的模块,也方便他那块使用;在此笔者也非常感谢同事提出的问题。好了,具体如下:

    1. 界面效果(红色星号为css添加的模块)

      

    2. css模块:

    .addRedStar:after {
        content: '*';
        color: red;
        font-size: 18px;
    }

    3. HTML模块:

    <li class="mui-table-view-cell pd_0">
                        <div class="mui-input-group business_form">
                            <div class="mui-input-row">
                                <label  class='addRedStar' >支出类别</label>
                                <input type="text" id="issuesCategoryDesc" data-value="" placeholder="请选择" name = "" class = "choose_category" readonly>
                            </div>
                            <div class="mui-input-row">
                                <label  class='addRedStar' >支出项目</label>
                                <input type="text" id="issuesClassDesc"    data-value="" placeholder="请选择" name = "" class = "choose_project" readonly>
                            </div>
                            <div class="mui-input-row">
                                <label  class='addRedStar' >经济事项</label>
                                <input type="text" id="economicIssuesDesc" data-value="" placeholder="请选择" name = "economicProject" class = "choose_economics" readonly>
                            </div>
                        </div>
     </li>

           如上述,html在需要的标签加上css中声名的addRedStar,就可以在后边加上标红的星号。

        如果大家有更好的建议,请提出来,大家共同进步。

  • 相关阅读:
    Ubuntu12.04 亮度调节和保存
    算法
    Python一些常见问题的解决方法
    数据结构
    C# 运行时编译代码并执行 【转】
    C# 动态添加属性 非原创 有修改
    30天学通Visual C++项目案例开发 下載
    .NET常用Request获取信息
    获取一个目录下所有的文件,包括子目录的
    C++入门到精通_全集下载
  • 原文地址:https://www.cnblogs.com/lidelin/p/9983152.html
Copyright © 2011-2022 走看看