input 做下拉框，可编辑下拉框

　

下拉框

如果是无需编辑的下拉框可用seclet标签实现

<p>
            <label for="sex">性别:</label>
            <select id="sex" >
                <option>男</option>
                <option>女</option>
            </select>
        </p>

如果需要能编辑里面的内容则使用input实现

input有个属性，list,自定义list中的内容即可

        <p class="changeDiv">
            <a>性别:</a>
            <input id="sex" type="text" list="sexlist">
            <datalist id="sexlist">
                <option>男</option>
                <option>女</option>
            </datalist>
        </p>

css代码

p.changeDiv input {
    font-size: 1em;
    font-family: 仿宋, serif;
    width: 60%;
    display: block;
    margin-left: 10%;
    opacity: 0.8;
    padding: 0.2em;
    color: #000000;
    border-radius: 10px;
    background-color: #bed8df;
}

datalist标签里面写下拉的内容，此为一个选择性别的框，里面有男女两个选项

datalist的id一定要和input 的list属性的值一致

效果如下

相关阅读

刷百度相关搜索和下拉框的技术原理

第一：百度搜索SEO出现的相关搜索：以SEO为核心的相关词-什么是SEO，如何进行SEO以SEO语义相关的相关词-网络推广第二：搜狗搜索SEO出现的

网站SEO之巧用百度下拉框引流量

百度下拉框这个功能，一直受到很多企业老板或者新手追捧，因为搜索某个关键词的时候，就会在搜索框上出现刷出来的现象词，对于这些词我们

HTML选择下拉框后，页面内容根据选择去变化

有时候，我们需要去实现选择下拉选之后，页面上的内容根据选择的不同而进行不同的变化。我在这里需要实现的是下拉选选择的是公司，公司

刷百度下拉框和刷百度相关搜索的方法

想必大家都知道在百度搜索引擎输入关键词的时候下面会显示很多相关的关键词，这些关键词的流量都是非常多的，而且刷百度下拉框比刷相

百度刷下拉框的工具原理及方式

自从搜索引擎推广逐渐盛行以来，很多SEO推广人员纷纷研究出了多种推广方式，有搜索引擎排名优化方式，也有相关搜索方式，还有百度刷下拉