duanjiao6735
2017-05-14 23:36 阅读 52
已采纳

为什么我的网站在我的代码编辑器预览中看起来很好但是它在实时网站上搞砸了? [重复]

This question already has an answer here:

http://imgur.com/a/FLlGL

My html updates are going through but something is off with the css...

Could it be like a duplicate script in the index.html?

Here is my code I really have no idea what could it be. I am using a block layout for the html page. Is there a bootstrap grid html I could use instead for the 4 block section layout instead? Thanks ahead of time.

  // Closes the sidebar menu
    $("#menu-close").click(function(e) {
        e.preventDefault();
        $("#sidebar-wrapper").toggleClass("active");
    });
    // Opens the sidebar menu
    $("#menu-toggle").click(function(e) {
        e.preventDefault();
        $("#sidebar-wrapper").toggleClass("active");
    });
    // Scrolls to the selected menu item on the page
    $(function() {
        $('a[href*=#]:not([href=#],[data-toggle],[data-target],[data-slide])').click(function() {
            if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') || location.hostname == this.hostname) {
                var target = $(this.hash);
                target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
                if (target.length) {
                    $('html,body').animate({
                        scrollTop: target.offset().top
                    }, 1000);
                    return false;
                }
            }
        });
    });
    //#to-top button appears after scrolling
    var fixed = false;
    $(document).scroll(function() {
        if ($(this).scrollTop() > 250) {
            if (!fixed) {
                fixed = true;
                // $('#to-top').css({position:'fixed', display:'block'});
                $('#to-top').show("slow", function() {
                    $('#to-top').css({
                        position: 'fixed',
                        display: 'block'
                    });
                });
            }
        } else {
            if (fixed) {
                fixed = false;
                $('#to-top').hide("slow", function() {
                    $('#to-top').css({
                        display: 'none'
                    });
                });
            }
        }
    });
$(document).ready(function() {
    // Test for placeholder support
    $.support.placeholder = (function(){
        var i = document.createElement('input');
        return 'placeholder' in i;
    })();

    // Hide labels by default if placeholders are supported
    if($.support.placeholder) {
        $('.form-label').each(function(){
            $(this).addClass('js-hide-label');
        });  

        // Code for adding/removing classes here
        $('.form-group').find('input, textarea').on('keyup blur focus', function(e){
            
            // Cache our selectors
            var $this = $(this),
                $parent = $this.parent().find("label");

            if (e.type == 'keyup') {
                if( $this.val() == '' ) {
                    $parent.addClass('js-hide-label'); 
                } else {
                    $parent.removeClass('js-hide-label');   
                }                     
            } 
            else if (e.type == 'blur') {
                if( $this.val() == '' ) {
                    $parent.addClass('js-hide-label');
                } 
                else {
                    $parent.removeClass('js-hide-label').addClass('js-unhighlight-label');
                }
            } 
            else if (e.type == 'focus') {
                if( $this.val() !== '' ) {
                    $parent.removeClass('js-unhighlight-label');
                }
            }
        });
    } 
});

// When the user clicks on <div>, open the popup
function myFunction() {
    var popup = document.getElementById("myPopup");
    popup.classList.toggle("show");
}
#designer .container{
    text-align:center;
    max-width:450px;
    margin:0 auto;
}
#designer .block{
    width: 31em;
    height:22em;
    margin:10px;
    display:inline-block;
    background:none;
}
#designer .block1{
    width: 31em;
    height:22em;
    margin:10px;
    display:inline-block;
    background: none;
    float: right;
}
<section id="designer" class="section-padding">
             <div id="container">
    <div class="block"><img src="img/evan1.png"></div>
    <div class="block1"><h3>Your Designer</h3>
              <h4> Evan Braun</h4>
                <p>Hailing from The Queen City (Cincinnati, OH), I made my way down to Lexington, Kentucky to pursue a career in Business Management alongside computer science courses at the University of Kentucky. Computer literacy has been an interest throughout my life. Growing up, I developed a passion for it through graphic design and media editing which eventually led me to where I am today - web design.</p>
        <p> <b>I've made it my mission statement to not consider a project completed until the customer is 100% satisfied with their product.</b></p></div>
    <div class="block">
        <h5><span>Experience</span></h5>
        <p><i class="fa fa-check-square-o" aria-hidden="true"></i> 3+ Years of programming practice in HTML, CSS, PHP, JQuery, and JavaScript.</p>
        <p><i class="fa fa-check-square-o" aria-hidden="true"></i> Trained in SEO &amp; SEM from DreamWalker Social Marketing | Lexington, KY.
        <p><i class="fa fa-check-square-o" aria-hidden="true"></i> 5+ Years of graphic design experience in Adobe Photoshop + Illustrator.
        <p><i class="fa fa-check-square-o" aria-hidden="true"></i> 0 Clients disappointed.
        
    </div>
    <div class="block1"> 
        <h5>I like getting to know my clients personally</h5>
            <p>Being a native of Cincinnati and Lexington, I know that many small business owners in the area prefer dealing face-to-face with their service providers. It’s all part of building trust and confidence. It also allows me to get to know your business on a deeper level, and this has a very positive impact on how your website design turns out.<br><br>
Just let me know how you prefer to work when you <a href="#contact">contact</a> me.</p></div>
</div>
            </div> <!-- container --> 
    </section>

</div>
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享

2条回答 默认 最新

  • 已采纳
    douwenpin0428 douwenpin0428 2017-05-14 23:45

    Without seeing your code, it's rather difficult to tell exactly what the problem is.

    Having said that, my best guess is that you have cached the website, so you are seeing an old version of the CSS. Try clearing your cache by holding down SHIFT while clicking the refresh icon, in order to flush your cache.

    Hope this helps!

    点赞 评论 复制链接分享
  • duanjing9339 duanjing9339 2017-05-14 23:49

    I have found that when working with HTML and CSS on a test server or live site, sometimes some or none of the changes I make to the styling takes effect. To fix this I use [CTRL+F5] to refresh the cached version of the site entirely.

    点赞 评论 复制链接分享

相关推荐