我想制作一个非常简单的导航栏,在其中可以选择正确的选项,但是我想在CSS中对其进行格式化:大小,字母大小,在其上形成半径,而不是简单的矩形形状。
我在HTML中具有以下代码:
<div class="select">
<select>
<option>Choose the Project</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
</select>
</div>
如何获得下拉列表,以通过CSS编辑其前景?
为了自定义HTML页面上的任何元素,您首先需要通过其ID,其TAG或CLASS(它们是HTML页面中的基本标识符)来标识该元素,因此在您的代码案例中,该标签是.select是一个类,您的代码没有该元素的任何ID。您不需要全部将代码应用于该元素(选择菜单)。
您的解决方案:
将此代码添加到您选择菜单所在的HTML页面:
<style>
select {
color:white;
background: blue;
border-radius: 5px;
width: 200px;
height: 50px;
}
</style>
上面的代码将针对“ SELECT”标签(而非类),并将应用CSS代码(标签之间的代码)。
<style>...</style>
标记表示HTML将使用它来定制页面样式的css代码。
更改后,完整代码将显示在此页面上,带有LIVE预览。https://codepen.io/zetagalactic/pen/GRJNQge
您如何更改或添加更多样式?
只需在<style>...</style>
标签之间添加更多CSS代码,即可应用它们。在线搜索CSS代码示例以查看更多选项。
让我知道您是否仍然需要帮助。