私は今でもまだ早いですが、皆さんがその上にいることも知っています。
HTML5の詳細要素を使用したい:
<details>
<summary>What's the HTML5 details element?</summary>
<p>The details element represents a disclosure widget from which the user can obtain additional information or controls.</p>
</details>
この記事の執筆時点で、Chrome 12ベータ版は、詳細要素の機能を実際に提供する唯一のブラウザーです(概要をクリックすると、詳細コンテンツが切り替わります)。したがって、次の質問に答えるには、おそらくそのブラウザを使用することをお勧めします。
Chromeの詳細要素にデフォルトで表示される矢印を非表示にする方法を知っていますか?
<input type="search" />
これは、Webkitのデフォルトのスタイルに少し似ています( http://css-tricks.com/webkit-html5-search-inputs/を参照)。あなたはそれを変えることができますが、それはそれほど明白ではありません。
編集
次のCSSコードを試しましたが成功しませんでした。
details,
details summary {
padding-left:0;
background-image:none;
-webkit-appearance:none;
}
おそらく、のような奇妙な疑似セレクターでターゲットにする必要がある可能性があります。そうでない場合はdetails::-webkit-details-disclosure-widget
、現在、状況をまったく変更する方法がありません。
さらに、私はこれを仕様で見つけました:
最初のコンテナには少なくとも1つのラインボックスが含まれている必要があり、そのラインボックスには、詳細要素の左側のパディング内に水平に配置された開示ウィジェット(通常は三角形)が含まれている必要があります。そのウィジェットは、ユーザーが詳細の表示または非表示を要求できるようにすることが期待されています。