html - 无法覆盖网页模板中的内联 CSS-6ren

html - 无法覆盖网页模板中的内联 CSS

转载作者：太空宇宙更新时间：2023-11-03 21:18:35

我很难覆盖以免费 HTML 模板开始的网页的内联样式。我试过使用“!重要”关键字，但它并没有覆盖它。当我检查 Chrome 中的元素时，我可以关闭“padding-top: 164px”的“element.style”部分，但我无法在 CSS 中摆脱它。我是初学者，所以我确定我只是遗漏了一些东西，但我不知道还能搜索什么。

澄清一下，问题出在将 div 的顶部填充设置为 164px 的内联样式，我希望它更小。

html:

<!DOCTYPE html>
<html>
<head>
    <title>Senkadagala</title>
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
    <link href='http://fonts.googleapis.com/css?family=Roboto:400,300,100,400italic,500,700' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" type="text/css" href="css/main.css">




<script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/singlepagenav.js"></script>
    <script type="text/javascript" src="js/queryloader.js"></script>    
    <script type="text/javascript" src="js/main.js"></script>

    <meta charset="UTF-8">
    <meta name="description" content="Senkadagala - a simple HTML template">
    <meta name="keywords" content="web design, web development, branding, Social media marketing, print media design, digital design, HTML,CSS,XML,JavaScript">
    <meta name="author" content="PixelMock">

    <link rel="icon" type="image/png"  href="img/fav.png" />
</head>
<body>
    <div class="navbar navbar-inverse navbar-fixed-top top-nav" role="navigation">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">
            <p class="slogan">"Members First, Service Always."</p>
          </a>
        </div>
        <div class="collapse navbar-collapse">
          <ul class="nav navbar-nav">
            <li><a href="#home">Home</a></li>
            <li><a href="#services">Services</a></li>
            <li><a href="#calendar">Calendar</a></li>
            <li><a href="#intranet">Intranet</a></li>
          </ul>
        </div><!--/.nav-collapse -->
      </div>
    </div>

这里是有问题的区域:

    <div class="content"  id="home">
        <div class="section section1">
            <div class="container">
                <div class="row">
                    <img src="img/TransPatriotLogo.png">
                </div>
                <div class="row">
                    <h4 class="bodytext">Symitar for Windows 2</h2>
                </div>

                <div class="row">
                    <h5 class="bodytext">
                        © 2016 - Patriot Federal Credit Union
                    </h5>
                    <h5 class="bodytext">
                        All Rights Reserved
                    </h5>
                </div>

            </div>
        </div>

下一个不重要的部分:

        <div class="section section2" id="services">
            <div class="container">
                <div class="row" id="services-row">
                    <h3 id="services-title">Services</h3>
                    <p>
                        Services go here.
                    </p>

                    <p>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut id ultricies felis. Fusce sed nisi velit. Quisque cursus pharetra diam, non congue ligula sodales at. Phasellus sodales sem sagittis arcu vulputate dictum. Vestibulum faucibus malesuada risus. 
                    </p>

...continued...

这是 CSS:

body
{
    text-align: center;
    padding: 0px;
    margin: 0px;
    font-family: "Roboto",sans-serif;
    font-size: 12px;
    color:#d3d3d3 !important;
}

body .text-color1 
{
    color: #882565;
}

body .text-color2 
{
    color: #C54D8D;
}

.container
{
    /*width:1200px;*/
    margin: 0px auto;
    /*text-align: left;*/
}

.top-nav
{
    position: fixed;
    height: 70px;
    padding-top: 10px;
    padding-bottom: 10px;
    width:100%;
    background-color: #f8f8f8;
}

.top-nav li a
{
    font-size:16px;
    font-family: "Roboto";
    font-weight: bold;
    color:#0e3d83 !important;
}

.slogan
{
    color: #0e3d83;
    font-family: "Monotype Corsiva";
    font-weight: bold;
    font-size: 26px;
    margin-top: 15px;
}

.bodytext
{
    color: #0e3d83;
    font-family: "Trebuchet MS";
    font-weight: bold;
}

.navbar li .current
{
    background-color: transparent;
    color: #d92727 !important;
    outline: none;
}

.navbar-brand
{
    padding-top: 0px;
}

.top-nav li a:hover
{
    color:#C54D8D!important;
}

.navbar-inverse
{
    border: none;
    box-shadow: 0px 1px 5px #0e3d83;
}

.content
{
    padding-top:70px;
}

.section1
{
    background: url(../img/whiteflag.png);
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-position:50% -400px;
}

.logo-row
{
    padding-top: 0px;
}
.section1 .main-logo
{
/*  background: url("../img/TransPatriotLogo.png") no-repeat scroll center center rgba(0, 0, 0, 0);
    height: 200px;
    width: 500px;
    margin-left: auto;
    margin right: auto; */
}

.section1 h2
{
    color: #0e3d83;
    font-family: "Trebuchet MS";
    font-weight: bold;
}

.section1 p
{
    font-size: 20px;
    color: #0e3d83;
    font-family: "Trebuchet MS";
    font-weight: bold;
}

.section2
{
    padding-top: 100px;
    /*padding-bottom: 200px;*/
}

.section2 .intro-text
{
    /*text-align: left*/
}

.section2 img
{
    margin: 0 auto;
}

.section2 h3#services-title
{
    font-family: "Roboto", sans-serif;
    font-size: 34px;
    color: #0e3d83 !important;
    font-weight: 300;
    margin-bottom: 40px;
}

.section2 .team
{
    padding: 150px 0px 100px 0px;
}

.section2 .team img
{
    margin:0px auto;
}

.section2 .team h3.team-name
{
    color:#848484;
    margin-bottom: 5px;
}

.section2 .team h4.team-subtitle
{
    margin-top: 0px;    
    font-weight: lighter;
    color:#848484;
    margin-bottom: 20px;
}

.section2 .team p.team-details
{
    text-align: center;
    font-size: 16px;
}

.section2 p
{
    color: #848484;
    font-size: 18px;
    font-family: "Roboto", sans-serif;
    margin-bottom: 20px;
    font-weight: 300;
    text-align: left
}

.section3
{
    background: url(../img/workspace-sub.jpg) rgba(213,30,155, 0.6);
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-position:50% 0%; 
    padding-top: 200px;
    padding-bottom: 200px;
}

.section3 .container
{
    
}

.section3 img.img-responsive
{
    margin: 0 auto;
}

.section3 h3
{
    color: #848484;
    font-weight: 400;
}

.section3 p
{
    color: #848484;
    font-weight: 300;
    font-size: 18px;
}

.section4
{
    /*height:600px;*/
}

.item 
{ 
    width: 20%; 
    background-color: red;
    height:300px;
    float:left;
    position: relative;
}

.item.w2 
{ 
    width: 25%; 
}

.item.w3
{
    width: 40%; 
}

.item .hidden-item
{
    display: none;
}

.portfolio
{   
    padding: 100px 0px
}

.portfolio #portfolio-introduction
{
    margin-bottom: 100px;
    margin-top: 100px;
    color: #828282;
}

.portfolio #portfolio-introduction p
{
    font-size: 24px;
    font-weight: lighter;
}

.portfolio #portfolio-items
{
    border-top: 1px solid #D6D6D6;
    border-bottom: 1px solid #D6D6D6;
}

.portfolio .item .hover-content
{
    width: 100%;
    height: 100%;
    background: #8a0175;
    opacity: 0.8;
    position: absolute;
    padding: 20px;
    display: none;
    transition:all 0.5s ease 0s;
    cursor: pointer;
}

.portfolio .item .hover-content h3
{
    font-size: 34px;
    font-weight: lighter;
    color: #fff;
    position: relative;
    top:30%;
}

.portfolio .item:hover .hover-content
{
    display: block;
}

.portfolio .item  .portfolio-popup h3
{
    margin-bottom: 30px;
    margin-top: 0px;
    color:#828282;
} 

.portfolio .item .portfolio-popup p
{
    color: #828282;
    line-height: auto;
    font-size: 18px;
    font-weight: lighter;
}


.portfolio .item .portfolio-popup .popup-image-container
{
    padding: 20px;
}

.portfolio .item .portfolio-popup .popup-image-container img
{
    margin: 0 auto
}

.portfolio .item  .portfolio-popup .portfolio-item-description
{
    border-bottom: 1px solid #8D8D8D;
    padding: 40px;
    text-align: left;
}

.portfolio .item .portfolio-popup .labels
{
    margin-top:20px;
    line-height: 30px;
}


.portfolio .item  .portfolio-popup .portfolio-item-description span.label
{
    font-family: "Roboto", sans-serif;
    font-size: 12px;
    font-weight: lighter;
}

.portfolio h3
{
    font-size: 60px;
    font-family: "Roboto", sans-serif;
    font-weight: lighter;
}

.footer
{
    background: url(../img/footer-bg.jpg) repeat-x left bottom #000;
    /*padding-top: 200px;*/
}

#contact
{
    /*padding-bottom:80px;*/
    font-family:"Roboto", sans-serif;
    font-weight:300;
    min-height:600px;
}

#contact #contact-us-header
{
    font-size: 44px;
    font-weight: lighter;
    margin-bottom: 50px
}

#contact #contact-form input[type=submit]
{
    background-color:#C54D8D;
    border:1px solid #882565                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        
}

#contact #contact-form
{
    text-align: left;
}

#contact #contact-form label
{
    font-size: 16px;
    font-weight: lighter;
}

#contact .contact-description p
{
    font-size:20px;
}

.sm-wrapper
{
    margin-top:30px;
    margin-bottom:50px;
}


.sm-wrapper a:hover
{

}

.sm-container
{
    width:32px;
    height:32px;
    display:block;
    float:left;
    background:url(../img/sm-sprite.png) no-repeat;
    margin-right:10px;
}

.sm-container:hover
{
    /*border-bottom:5px solid #C54D8D;*/
    cursor:pointer;
}

.sm-facebook
{
    background-position:0px -32px;
}

.sm-linkedin
{
    background-position:0px -64px;
}

.sm-gplus
{
    background-position:0px -96px;
}

.sm-skype
{
    background-position:0px -128px;
}


/* end of contact section */



/* Landscape phones and down */
@media (max-width: 480px) { 

    .section2 p
    {
        font-size: 18px;
        font-weight: 300;
    }

    .section2 img
    {
        padding-bottom: 60px;
    }

    .item,.item.w2 , .item.w3
    { 
        width: 100%; 
    }

    .portfolio .item  .portfolio-popup h3
    {
        font-size: 42px;
    } 

    .portfolio .item .portfolio-popup p
    {
        font-size: 16px;
        font-weight: lighter;
    }

    .section2 .team img
    {
        padding-bottom: 0px;
    }

    .section3 .service-item
    {
        margin-bottom: 50px
    }

    .section3 .service-item p
    {
        font-size: 18px;
        margin: 0 auto;
        width: 75%;
    }


 }

/* Landscape phone to portrait tablet */
@media (min-width: 481px) and (max-width: 767px) {
    .section3 .service-item
    {
        margin-bottom: 50px
    }

    .section3 .service-item p
    {
        font-size: 18px;
        margin: 0 auto;
        width: 75%;
    }

    .section2 p
    {
        font-size: 20px;
        font-weight: 300;
    }

    .section2 img
    {
        padding-bottom: 0px;
    }

    .item,.item.w2 , .item.w3
    { 
        width: 100%; 
    }

    .navbar-nav
    {
        background-color:#F8F8F8
    }
}


/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 1024px) {
    .section2 img
    {
        padding-bottom: 60px;
    }

    .section2 p
    {
        font-size: 20px;
    }

    .section2 img
    {
        padding-bottom: 0px;
    }

    .section3 .service-item
    {
        margin-bottom: 50px;
        font-size: 18px;
    }

    .portfolio .item .hover-content
    {
        width: 100%;
        height: 100%;
        background: #8a0175;
        opacity: 0.8;
        position: absolute;
        padding: 20px;
        display: none;
        transition:all 0.5s ease 0s;
        cursor: pointer;
    }

    .portfolio .item .hover-content h3
    {
        font-size: 18px;
        font-weight: 300;
        color: #fff;
        position: relative;
        top:30%;
    }

    .portfolio .item:hover .hover-content
    {
        display: block;
    }

    .portfolio .item  .portfolio-popup h3
    {
        margin-bottom: 30px;
        margin-top: 0px;
        color:#828282;
        font-size: 42px;
    } 

    .portfolio .item .portfolio-popup p
    {
        color: #828282;
        line-height: auto;
        font-size: 16px;
        font-weight: lighter;
    }

    .item 
    { 
        width: 20%; 
        background-color: red;
        height:200px;
        float:left;
        position: relative;
    }

    .item.w2 
    { 
        width: 25%; 
    }

    .item.w3
    {
        width: 40%; 
    }

    .navbar-nav
    {
        float: right;
    }
}

/* Large desktop */
@media (min-width: 1025px) {
    .navbar-nav
    {
        float: right;
    }
}

.clearfix:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */

最佳答案

2种解决方式:

查看是否有任何 HTML 模板具有您想要的内联样式并将其删除
如果 1 不起作用:查找可能添加这些样式的任何 Javascript(使用文本编辑器中的搜索功能)。

关于html - 无法覆盖网页模板中的内联 CSS，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39616991/

文章推荐： python - 循环脚本以生成多个图像

文章推荐： python - 将 pandas 数据框导出为 CSV

文章推荐： c# - EF 一对一主要关系错误

java - 使用 selenium webdriver 从屏幕 A(网页)跳转到屏幕 B(网页)，绕过中间屏幕(网页)
这个问题与窗口处理或多个浏览器窗口的杂耍无关，而是关于在同一窗口中浏览 Web 应用程序的网页。我遇到这样的情况 1.我导航为屏幕 A->屏幕 x->屏幕 Y->屏幕 B 2.我需要捕获首次登录时屏幕
网页:系统会记录用户显示每个页面的时长
我有这个要求: The system will record the length of time the user displayed each page. 虽然在富客户端应用程序中微不足道，但我不
JavaScript 网页
我在调试 JavaScript 网页时遇到问题。我遇到困难的地方是我标记 (...) 的地方。我收到未定义的错误。我是否将函数 countDown(start, Increment) 中的参数(即 s
网页 |屏幕中央菜单栏
需要一些帮助。我刚开始学习 HTML，今天一直在研究如何制作菜单，但在这样做时遇到了问题。我似乎不知道如何在屏幕上居中显示菜单。这就是我目前所拥有的； Home
javascript - 我想通过单击按钮将小程序的任何参数发送到浏览器。 (网页)
我想通过单击按钮将小程序的任何参数发送到浏览器。 (HTML)。我知道按钮对象有一些方法，但不知道使用哪个。我怎样才能做到这一点？ps .: 我使用的是 jnlp 协议(protocol)。类似于:
java - 使用维基百科数据时如何提高性能？网页？
我应该使用Wikipedia的文章链接数据转储从组织的网站中提取代表性术语。为此，我已经- 抓取并下载了该组织的网页。 (〜110,000) 创建了Wikipedia ID和术语/标题的字典。 (约
javascript - 我如何从android调用javascript函数(网页)？
我的网页中包含 javascript 函数... function callFromAndroid(varName) { alert("call from android activated by
java - 用java编辑html/网页
我想创建一个 Java 应用程序，允许用户导入网页并能够在程序中对其进行编辑。导入网页将对其进行渲染，并且页面的组件(图像、文本等)将是可编辑或可拖动的，从而允许用户重新布局组件。例如，用户可以加
java - 将scrollPane添加到EditorPane(网页)
当我们按下按钮时，我向 JFrame 添加了一个网页(网页在同一框架中打开)。效果很好。但我想向其中添加一个scrollPane，但是当我添加 JScrollPane jsp = new JScrol
javascript - 网页 |定心
我在使用 particles.js 时无法将图像居中。图像居中，但略微偏离中心。为什么要这样做，我如何才能将它居中？ html particles.js demo CSS
javascript - 加载页面时如何修复音频不自动播放？ - 网页
我正在尝试在加载页面时播放音频，它应该非常简单但我无法完成。问题是它没有播放，我尝试检查自动播放的状态(真/假)，它说它在页面加载时播放，尽管它没有播放，还尝试制作一个将改变自动播放的功能状态为
javascript - 显示选定的图像、网页
我正在尝试显示用户从列表中选择的图像，但我在屏幕上看不到任何内容。 .container { position: relative; } .ce
html - Bootstrap 网页
这听起来有点奇怪，但我需要一些帮助，网页必须有一行必须包含三个部分，第一部分必须有 1 列的偏移量，并且部分之间的空间必须是 10px到目前为止，使用 Bootstrap 一切顺利。现在第二行将有
html - 网页 - 以毫米为单位的图像大小
这个问题在这里已经有了答案: Web and physical units (2 个答案) Div width in cm (inch) (6 个答案) 关闭 9 年前。
javascript - 网页。背景是如何构建的。
这个问题不太可能帮助任何 future 的访问者；它只与一个小的地理区域、一个特定的时间点或一个非常狭窄的情况有关，这些情况并不普遍适用于互联网的全局受众。为了帮助使这个问题更广泛地适用，visit
css - IPython笔记本设置笔记本面板的宽度(网页)
我想将我的 IPython 笔记本的宽度设置为 2500 像素，并且我希望它左对齐。我该怎么做？我使用这段代码来应用我自己的 CSS: from IPython.core.display impor
Javascript |网页 |饼图状态
关闭。这个问题需要更多focused .它目前不接受答案。想改进这个问题吗？更新问题，使其只关注一个问题 editing this post . 关闭 7 年前。 Improve this q
javascript - 如何接受姓名和号码输入并将其添加到文档/网页
我在 Word 中制作了一份文档，希望人们在其中添加自己的姓名以及他们的教学经验。我已将其保存为网页并发布到此处: http://epicforum.net/TS ...但操作部分实际上就是这样: h
javascript - 按下空格键时触发按钮单击(网页)
这个问题在这里已经有了答案: Execute JS code after pressing the spacebar (5 个答案) 关闭 4 年前。
javascript - 要求用户先登录 - 网页
我正在开发一个只有两个页面的网站。 1.登录 2.首页我正在使用 Angular 框架。 app.config(['$routeProvider', function ($routeProvider

太空宇宙

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

html - 无法覆盖网页模板中的内联 CSS