扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
一、div 标签未关闭
成都创新互联是一家专业提供枝江企业网站建设,专注与成都网站建设、网站建设、H5建站、小程序制作等业务。10年已为枝江众多企业、政府机构等服务。创新互联专业网站建设公司优惠进行中。
这是版面设计失效的最常见原因之一。当我们了解到这是多少精致的版块设计失效的罪魁祸首时,总会大吃一惊。开启的div标签是最普遍的版块设计失误之一,也是最难诊断的失误之一。验证程序有时会指向错误的开启div标签,诊断时就像大海捞针一样麻烦。
二、不当的DOCTYPE声明
不声明DOCTYPE,或者在文件开始错误声明DOCTYPE,也是一个常见错误。根据一般经验,Strict DOCTYPE是大家追求的最高级验证。Strict validation表明你的网页能够在所有浏览器上都得到最佳展示。
三、结尾斜线
如果你的网站不能验证,很有可能是在代码的某个地方漏写了结尾斜线。我们很容易忽略结尾斜线之类的东西,特别是在image标签等元素中。
在严格的DOCTYPE中这是无效的。要在img标签结尾处加上“/”以解决此问题。
四、JavaScript
如果已经声明Strict DOCTYPE,就需要在JavaScript中覆盖CDATA标签。验证程序的这一方面难倒了很多程序员,因为网站倾向于为广告和追踪脚本使用嵌入的 JavaScript。
五、不良嵌套
嵌套就是元素里又包括元素,我们容易混淆嵌套元素的顺序。例如在div标签前启动strong标签,但又先关闭div标签。这可能不会改变版块布局,但却会使你的版块设计失效。
从代码上看,这import的路径就上绝对路径啊。
首先要确认import的这些css的具体路径是什么,如果是从根目录开始,那你前面就少东西,如果是相对路径,那就改成相对路径,是相对这个css的路径。如果这些css跟这个主css是同目录下的,那就用点开头的相对路径。
这个没别的问题,如果前台报错,后台不报错,那肯定就是路径的问题了,不用纠结别的。
解决方法:加display:inline;
例:
#content {
float: left;
width: 500px;
padding: 10px 15px;
margin-left: 20px;
display:inline;
}
2.克服盒子模型的hack
原写法:
#main-div{
width: 150px;
border: 5px;
padding: 20px;
}
修正后
#main-div1{
width: 150px;
}
#main-div1 div{
border: 5px;
padding: 20px;
}
例如:
div id="main-div"1/div
div id="main-div1"div2/div/div见图:
两者区别:1是把padding加到父层里,DIV的宽度是150+20+20
2是把PADDING加到子层里,div的宽度是150.
我习惯是用1的方法去自己计算宽高.
3,4.最小高度(最小宽度)IE不识别的解决方法
.container {
width:20em;
padding:0.5em;
border:1px solid #000;
min-height:8em;
height:auto;
}
* html .container {
height: 8em;
}
5.整块元素居中对齐的方法
body{
text-align: center;
}
#container
{
text-align: left;
width: 960px;
margin: 0 auto;
}
先定义BODY中的文字整个居中text-align:center,再定义其中需要左对齐的子元素text-align:left;
6.垂直居中的CSS
#wrapper {
width:530px;
height:25px;
background:url(container.gif) no-repeat left top;
padding:0px 10px;
}
#wrapper p {
line-height:25px;
}
适用单行文字,将height设成line-height同值
那是因为引入外部样式之后,外部样式和内部样式有冲突,并且外部样式的级别高于内部样式导致的。
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流