ホームページ > ウェブフロントエンド > htmlチュートリアル > スタイルシートの変更方法_html/css_WEB-ITnose

スタイルシートの変更方法_html/css_WEB-ITnose

WBOY
リリース: 2016-06-24 12:00:24
オリジナル
996 人が閲覧しました

元の Web ページのネスト状況では、form1 が searchdiv にネストされています。ここで、本文部分を次のコードに変更する必要があります:

<body>   <form id="form1" name="form1" method="post" runat="server">    <div id="admin">        <ul id="nav1">            <li>                <img src="images/administrator_pencil.png" width="58" height="62" />                <ul>                    <li><a href="EditInformation.aspx">个人资料</a></li>                    <li><a href="Default.aspx">退出登录</a></li>                </ul>            </li>        </ul>    </div>    <div id="searchdiv">            <input type="search" id="search" name="search" placeholder="学号或者姓名" runat="server" />            <input name="submit" type="submit" id="submit" value=""                runat="server"/>            </div>   </form></body>
ログイン後にコピー

この時点で、検索スタイルと送信スタイルが表示されなくなります。スタイルシートで修正しますか?
#searchdiv #form1 #submit {    background-color: transparent;    background-image: url(images/find.png);    height: 40px;    width: 40px;    position: absolute;    left: 505px;    top: 2%;}#searchdiv #form1 #search {    height: 40px;    width: 500px;    border: 1px solid #333333;}
ログイン後にコピー


ディスカッションへの返信 (解決策)

#form1 #searchdiv #submit {    background-color: transparent;    background-image: url(images/find.png);    height: 40px;    width: 40px;    position: absolute;    left: 505px;    top: 2%;} #form1 #searchdiv #search {    height: 40px;    width: 500px;    border: 1px solid #333333;}
ログイン後にコピー


実際には、これで十分です。スタイル名を定義するのが最善です

#submit {    background-color: transparent;    background-image: url(images/find.png);    height: 40px;    width: 40px;    position: absolute;    left: 505px;    top: 2%;} #search {    height: 40px;    width: 500px;    border: 1px solid #333333;}
ログイン後にコピー

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート