Question

这是我用嵌套div在这段代码中写到div手机的方式吗？

CSS

#pagewrap #pagemain .content .colrow .container .col548 #contactInfoArea #phone
{

}

HTML

<!-- Start: Pagewrap -->
<div id="pagewrap">
<div id="header">
    <div class="headerWrapper">
        <div id="headerTopItems"> <a class="mainLink" href="../Telge-Energi/Webbkarta/">Webbkarta</a> <a href="#" class="login closed">Min Sida</a>
            <div id="loginBoxWrapper">
                <div id="loginBoxButtonWrapper">
                    <div class="rounded buttonWrapper"></div>
                    <div id="topLoginButton">
                        <div class="rounded topLeft"></div>
                        <div class="rounded topRight"></div>
                        <a href="#" class="login open">Logga in</a> </div>
                    <div id="loginButtonShadow">
                        <div class="rounded topRight"></div>
                    </div>
                </div>
                <div id="loginBox">
                    <div class="rounded topLeft"></div>
                    <div class="rounded bottomLeft"></div>
                    <div class="rounded bottomRight"></div>
                    <div class="formWrapper"> </div>
                </div>
                <div id="loginBoxShadow">
                    <div class="rounded bottomLeft"></div>
                    <div class="rounded bottomRight"></div>
                </div>
            </div>
            <div class='searchForm png'> 

                <!--<div class="top-search png">-->

                <div id="ctl00_PageHeadRegion_ctl00_ctl00_QuickSearch1_Panel1" class="QuickSearchArea" onKeyPress="javascript:return WebForm_FireDefaultButton(event, 'ctl00_PageHeadRegion_ctl00_ctl00_QuickSearch1_SearchButton')"> </div>
            </div>
        </div>
        <div id="ctl00_TopSelectionPanel">
            <div id="topSelection"> 
                <!--<div class="menu">-->
                <div class='roundedtopLeft'></div>
                <ul>
                </ul>
                <div class='rounded topRight'></div>
            </div>
        </div>
    </div>

    <!-- Only visible for TE-->

    <div id="topMenu">
        <div class='rounded topLeft'></div>
        <div class='rounded topRight'></div>
    </div>
</div>

<!-- Start: Pagemain -->
<div id="pagemain">
    <div class="content"> 

        <!-- Visible for others then TE-->

        <div class="colrow"> 

            <!--Start: Left Manu -->

            <div id="leftmenu">
                <div id="ctl00_FullContentRegion_MainRegion_SubMenu_EmptyMenuPanel"> </div>
            </div>

            <!-- Start: Container -->
            <div class="container">
                <div class="verticalDivider left"></div>

                <!--Start: Main Area -->

                <div class="col548">
                    <div id="topnav">
                        <ul>
                            <li class="active"><a href="." class="first">Namn Rubrik</a></li>
                        </ul>
                    </div>
                    <img id="ctl00_FullContentRegion_MainRegion_MainContentRegion_MainBodyRegion_Image" src="../Global/Bilder/contact.jpg" style="border-width:0px;" /> <span>Namn Rubrik</span> <span>Utvecklare</span><br />
                    <div id="contactInfoArea"> **
                        <div id="phone">**
                            071-234567 </div>
                        <div id="mobile"> <span>071-234567</span> </div>
                        <div id="email"> <a href="mailto:namn@foretag.se"><span>namn@foretag.se</span></a> </div>
                    </div>
                    <span>Portals &amp; Web</span><br />
                    <span id="ctl00_FullContentRegion_MainRegion_MainContentRegion_MainBodyRegion_XForm1_PostedMessage" class="thankyoumessage"></span>
                    <div id="ctl00_FullContentRegion_MainRegion_MainContentRegion_MainBodyRegion_XForm1_FormPanel" class="xForm"> </div>
                    <br />
                    <div class="contentfooter">
                        <p><a href="javascript:window.print();" class="print">Skriv ut</a></p>
                        <p><a href="#" class="share">Tipsa en vän</a></p>
                    </div>
                </div>
                <div class="verticalDivider right"></div>
                <div class="col172"> 

                    <!-- Start: Slidingdrawer --> 

                    <!-- Start: Spot module --> 

                    <span id="ctl00_FullContentRegion_MainRegion_MainContentRegion_SecondaryBodyRegion_ErrorMessage" class="errorMessage" style="font-size:Small;"></span> </div>
            </div>
        </div>
    </div>
</div>
<div id="ctl00_PageFooterPanel"> 

    <!-- Start: Pagefooter -->
    <div id="pagefooter"> 

        <!-- Start: Contentfooter -->

        <div class="content">
            <div> </div>
        </div>
    </div>
</div>
<!-- page_completed --> 

<script src="../WebResource.axd?d=U8UcbPv0K0IV1GYpkK2BgA2&amp;t=634202716197779592" type="text/javascript"></script> 
<script type="text/javascript">
//<![CDATA[
EPi.SetupPropertyObjects = function()
{
    EPi.RegisterPropertyObject(window, "EPiObject", {EPiOnPageEditControl:"OnPageEditControl"});
}
//]]>
</script>
</form>

</body>

Answer 1

页面中的ID是唯一的，因此您只需要：

#phone {
}

如果您将样式表用于多个页面，并且id可能用于其他页面上的其他内容，则可以指定它仅在联系信息的一部分时才应用：

#contactInfoArea #phone {
}

Answer 2

没有。您将使用#phone。 ID是唯一的，只在文档中出现一次。

Answer 3

#phone {

}

可以解决问题，因为（#phone是ID，ID是唯一的： - ））

Answer 4

内联style属性有什么问题吗？：P

CSS到达嵌套div

4 个答案: