select {
width: 300px;
font-family: inherit;
font-size: 18px;
padding-top: 10px;
padding-bottom: 10px;
padding-right: 30px;
display:block;
color: #999;
border: none;
border-bottom: 1px solid #757575;
}
*:focus {
outline: #757575;
}
select:focus {outline:0;}

<select class="weekselection">
<option value="" disabled selected>Choose the weekday</option>
<option value="0">Monday</option>
<option value="1">Tuesday</option>
<option value="2">Wednesday</option>
<option value="3">Thursday</option>
<option value="4">Friday</option>
<option value="5">Saturday</option>
<option value="6">Sunday</option>
</select>
&#13;
箭头标出蓝色的东西。我尝试过
的组合select {
border: none;
}
*:focus {
outline: #757575;
}
select:focus {outline:0;}
但它仍然存在。我该如何删除它?谢谢!
HTML:
<select class="weekselection">
<option value="" disabled selected>Choose the weekday</option>
<option value="0">Monday</option>
<option value="1">Tuesday</option>
<option value="2">Wednesday</option>
<option value="3">Thursday</option>
<option value="4">Friday</option>
<option value="5">Saturday</option>
<option value="6">Sunday</option>
</select>
答案 0 :(得分:0)
与另一个问题相似,我引用:
选择的下拉列表是所谓的ShadowDOM的一部分。在目前的CSS规范3级中,没有办法定位大多数ShadowDOM元素。你可以在这里阅读关于ShadowDOM的规格,尽管那里没有你想要的东西。
Chrome有一些专有选择器可以更改一些shadowDOM元素,但不是全部。 Firefox的数量甚至更少(据我所知),Opera也没有。 IE可能同样糟糕或更糟。
考虑到兼容性,最好的办法是使用Jquery插件来模拟使用其他HTML元素的select,如果你真的想要设置它的样式。这是一个整洁的。
答案 1 :(得分:0)
答案是:你不能因为css无法修改选项的风格。
但是你可以使用一个列表,让它像下拉列表一样自由地设计风格:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
<label>One</label>
<ul>
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
<li>Five</li>
</ul>
</body>
</html>
<style>
ul {
display: table;
list-style: none;
padding: 0;
}
ul li {
display: block;
}
</style>
<script>
$("ul li").slideUp();
$("label").click(function () {
$("ul li").slideToggle();
});
$("ul li").click(function () {
$("label").text($(this).text());
$("ul li").slideToggle();
});
</script>
$("ul li").slideUp();
$("label").click(function () {
$("ul li").slideToggle();
});
$("ul li").click(function () {
$("label").text($(this).text());
$("ul li").slideToggle();
});
ul {
display: table;
list-style: none;
padding: 0;
}
ul li {
display: block;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label>One</label>
<ul>
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
<li>Five</li>
</ul>
答案 2 :(得分:-3)
我认为“!important”将帮助您解决问题。
INSERT INTO DomainAccounts (Domain_Name, Account_ID, SiteID, Account_Name)
SELECT Domain_Name, Account_ID, SiteID, Account_Name
FROM @T
INSERT INTO BotExceptions (DomainAccounts_Id, BotName)
SELECT da.Id, Item
FROM @T t
INNER JOIN DomainAccounts da ON t.Domain_Name = da.Domain_Name
AND t.Account_ID = da.Account_ID
AND t.SiteID = da.SiteID
AND t.Account_Name = da.Account_Name
CROSS APPLY dbo.SplitStrings(BotExceptions, ' ')
WHERE LEN(LTRIM(RTRIM(Item))) > 0
INSERT INTO BlockCountries (DomainAccounts_Id,CountryName)
SELECT da.Id, Item
FROM @T t
INNER JOIN DomainAccounts da ON t.Domain_Name = da.Domain_Name
AND t.Account_ID = da.Account_ID
AND t.SiteID = da.SiteID
AND t.Account_Name = da.Account_Name
CROSS APPLY dbo.SplitStrings(BlockCountries, ' ')
WHERE LEN(LTRIM(RTRIM(Item))) > 0