CSS:内联样式将应用于< fieldset>但是当我写相同的代码到外部css和引用通过id没有样式应用 [英] CSS: inline style gets applied to <fieldset> but when I write the same code to external css and reference by id no style applied

查看:147
本文介绍了CSS:内联样式将应用于< fieldset>但是当我写相同的代码到外部css和引用通过id没有样式应用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

https://jsfiddle.net/tdyd5naw/

css文件被正确链接,因为页眉和页脚div确实有风格。我认为这是一个问题的选择器,但尝试了很多选项,似乎与W3C相关的我失去了。

The css file is linked correctly as the header and footer divs do get styled. I am thinking it is a problem with the selectors but after trying as many options that seemed relevant from W3C I am at a loss.

以下是相关的HTML

Here is the relevant html

<body>

   <div class = "header"><h1>Library</h1>
   </div>

   <form action = "newUser.php" method = "POST">


      <fieldset  id="newAc">
         <legend>New Accouunt Details</legend>
         Choose Username: <br>
         <input type = "text" name = "uname"/><br>
         Choose Password: <br>
         <input type = "password" name = "pass1"/><br>
         Re-Enter Password: <br>
         <input type = "password" name = "pass2"/><br>
      </fieldset>

      <fieldset id = "personalInfo">
         <legend>Personal Info</legend>
         First Name: <br>
         <input type = "text" name = "fname"/><br>
         Surname: <br>
         <input type = "text" name = "sname"/><br>
         Address Line 1: <br>
         <input type = "text" name = "addr1"/><br>
         Address Line 2: <br>
         <input type = "text" name = "addr2"/><br>
         City: <br>
         <input type = "text" name = "city"/><br>
         Telephone Home: <br>
         <input type = "text" name = "hphone"/><br>
         Telephone Mobile: <br>
         <input type = "text" name = "mphone"/><br>
      </fieldset>

      <input type = "submit" value = "Register"/><br>

   </form>

   <div class = "footer">
   </div>

</body>

这里是相应的CSS

#newAc {
   position:relative; 
   disblay:block; 
   float:left; 
   top: 100px; 
}

#personalInfo{
   position: relative;
   display: block;
   float: left;
   top: 100px
}


推荐答案

你做错了。从feildset #newAc更改为feildset#newAc或#newAc
区别是
1. feildset #newAc是在$ b中查找带有#newAc的元素$ b feildset

2. feildset#newAc正在feildset中查找元素
,id为#newAc

3. #newAc正在查找具有ID为# newAc

you are doing it wrong.change it from feildset #newAc to feildset#newAc or #newAc The difference is 1. feildset #newAc is you are looking for an element with #newAc in a feildset
2. feildset#newAc is looking for an element within feildset with id #newAc
3. #newAc is looking for an element which has id #newAc

#newAc {
   position:relative; 
   disblay:block; 
   float:left; 
   top: 100px; 
}

#personalInfo{
   position: relative;
   display: block;
   float: left;
   top: 100px
}

 <fieldset  id="newAc">
         <legend>New Accouunt Details</legend>
         Choose Username: <br>
         <input type = "text" name = "uname"/><br>
         Choose Password: <br>
         <input type = "password" name = "pass1"/><br>
         Re-Enter Password: <br>
         <input type = "password" name = "pass2"/><br>
      </fieldset>

      <fieldset id = "personalInfo">
         <legend>Personal Info</legend>
         First Name: <br>
         <input type = "text" name = "fname"/><br>
         Surname: <br>
         <input type = "text" name = "sname"/><br>
         Address Line 1: <br>
         <input type = "text" name = "addr1"/><br>
         Address Line 2: <br>
         <input type = "text" name = "addr2"/><br>
         City: <br>
         <input type = "text" name = "city"/><br>
         Telephone Home: <br>
         <input type = "text" name = "hphone"/><br>
         Telephone Mobile: <br>
         <input type = "text" name = "mphone"/><br>
      </fieldset>

这篇关于CSS:内联样式将应用于&lt; fieldset&gt;但是当我写相同的代码到外部css和引用通过id没有样式应用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆