该文来自:www.52css.com
初学DIV+CSS?
有六个问题需要您关注一下!
作为DIV+CSS初学者,如果在动手写代码之前对网页整体结构由一个清晰认识的话,写起来会事半功倍!但是,写的过程中总是有这样那样的问题,使得我们不得不停下来去查找资料,弄清属性定义等等!
其实有很多方法可以在提高我效率的同时让我们对DIC+CSS有更深刻的理解!下面我们列举几点:
一、CSS命名规范:
1、文件命名规范
全局样式:global.css;
框架布局:layout.css;
字体样式:font.css;
链接样式:link.css;
打印样式:print.css;
2、常用类/ID命名规范
页 眉:header
内 容:content
容 器:container
页 脚:footer
版 权:copyright
导 航:menu
主导航:mainMenu
子导航:subMenu
标 志:logo
标 语:banner
标 题:title
侧边栏:sidebar
图 标:Icon
注 释:note
搜 索:search
按 钮:btn
登 录:login
链 接:link
信息框:manage
……
二、处理浏览器BUG问题
关于这点,不知那位高人把CSSBUG变成顺口溜了!在这里引用一下,很容易记住的!
1、IE边框若显若无,须注意,定是高度设置已忘记;
2、浮动产生有缘故,若要父层包含住,紧跟浮动要清除,容器自然显其中;
3、三像素文本慢移不必慌,高度设置帮你忙;
4、兼容各个浏览须注意,默认设置行高可能是杀手;
5、独立清除浮动须铭记,行高设无,高设零,设计效果兼浏览;
6、学布局须思路,路随布局原理自然直,轻松驾驭html,流水布局少hack,代码清爽,兼容好,友好引擎喜欢迎。
三、所有标签皆有源
只是默认各不同,span是无极,无极生两仪—内联和块级,img较特殊,但也遵法理,其他只是改造各不同,一个*号全归原,层叠样式理须多练习,万物皆规律。
四、图片链接排版须小心
图片链接文字链接若对齐,padding和vertical-align:middle要设定,虽差微细倒无妨。
五、IE浮动双边距
请用display:inline。
六、列表横向排版
列表代码须紧靠,空隙自消须铭记。
分享到:
相关推荐
《深入理解:基于Div+CSS的网页设计与布局》 Div+CSS是现代网页设计中的核心技术,它在构建Web标准的网页布局中扮演着至...无论你是初学者还是有经验的开发者,理解和掌握Div+CSS都将对你的网页设计事业产生深远影响。
在这个专题中,我们将深入探讨Div+CSS在购物网站模板中的应用,以及它对于网页设计的重要性。 首先,让我们了解什么是Div和CSS。Div(Division)是HTML中的一个布局容器,它允许我们将页面划分为多个独立的区域,...
值得初学者看看的一本很好书。 基础篇 1.1 必须知道的基础知识 知识一 DIV+CSS的叫法是不准确的 标准叫法是xHTML+CSS 知识二两大误区 误区一用了Table就不标准。误区二DIV标签越多越好 Table是...
在学习"Div+CSS"时,应注意以下几点: 1. 理解Web标准的重要性,包括XHTML、CSS和JavaScript等组成部分。 2. 正确使用XHTML标签,每个标签都有其特定的语义,不应过度依赖单一的标签如DIV。 3. 学习并掌握CSS选择器...
【描述】提到的"css+div 的入门教程",暗示了该资源可能包含一系列关于如何使用 `div` 元素配合 `CSS` 进行网页设计和布局的教学内容。`div` 作为网页布局的基本构建块,常通过 `CSS` 设置样式属性,如宽度、高度、...
在IT行业中,网页设计是至关重要的一个领域,而"Div+CSS"是构建现代网页布局的基础。本资源包“div+csspdf版”显然聚焦于这个主题,包含了两个关键文件:`css2.0中文手册.chm`和`DIV+CSS布局大全.pdf`。这两个文件都...
《DIV+CSS教程—十天学会web标准div+css标准之路》是一份全面且深入的教程,旨在帮助初学者在短时间内掌握网页布局的核心技术——DIV和CSS。此教程以Word文档的形式提供,易于阅读和打印,适合自学或者作为教学参考...
本资源“适合初学者的39个div+css网页布局例子”是为那些刚开始接触网页布局的朋友们精心准备的,旨在帮助他们快速掌握Div+CSS的基础知识和实践技巧。 首先,我们要理解Div(Division,分隔)元素在HTML中的作用。...
【标题】"红酒宣传DIV+CSS模板"是一个基于Web标准设计的网页模板,它利用了Div和CSS技术来实现精致的网页布局和样式控制。Div是HTML中的一个块级元素,用于组织页面结构,而CSS(层叠样式表)则负责定义这些Div元素...
这个“100个div+css网站模板(后50个)”的压缩包提供了50个额外的网页设计基础,帮助开发者和设计师们快速构建响应式、美观且易于维护的网站。 Div,全称是Division,是HTML中的一个容器元素,用来分隔和组织页面...
在网页设计领域,Div+CSS是一种常见的...通过分析和实践这些案例,初学者可以掌握Div+CSS的基本用法,进一步提升网页设计能力。同时,理解并熟练运用Div和CSS,将有助于创建更加美观、功能完善的网页,提高用户体验。
【标题】:“中文网站div+css” 在网页设计领域,Div+...总的来说,这个“中文网站div+css”资源包可能是初学者掌握网页布局技术的良好起点,通过实践和理解示例,能够逐步掌握Div+CSS的精髓,从而提升网页设计能力。
本教程《DIVCSS布局教程.pdf》将详细讲解这些概念,并通过实例指导如何在实践中应用,从而提升你的网站美化技能。无论你是初学者还是经验丰富的开发者,都能从中受益匪浅,为你的网页设计之路增添更多色彩和可能性。
【CSS+DIV】技术是网页设计领域中一种广泛使用的布局方式,它将HTML中的结构(Div)与表现(CSS)分离,使得网页设计更加灵活、可维护性更强。Div元素作为一个容器,可以用来组织页面内容,而CSS则负责定义这些Div的...
总之,这个div+css经典案例源码资源是初学者宝贵的实践材料,通过深入学习和动手操作,你可以快速提升网页设计技能,为成为一名熟练的前端开发者奠定坚实基础。希望你在这个过程中能收获满满,不断进步。如果你有...
【标题】"完整的DIV+CSS的企业站模板+官方需要300元" 涵盖了Web开发领域中的一种常见技术组合,即使用HTML的结构(Div)与CSS的样式来构建一个专业的企业级网站模板。这样的模板通常设计精美,布局合理,能够满足...
网页设计与开发中,Div+CSS以及JavaScript是两个至关重要的技术。Div+CSS主要用于页面布局和样式控制,而JavaScript则负责交互性和动态效果。在这个"Div+Css特效及JavaScript网页特效实例"压缩包中,包含了两个子...
随着前端技术的发展,现代框架如 React 和 Vue.js 逐渐流行,但 `div+css+jquery` 依然是许多网站开发的基础,尤其在需要快速开发和轻量级交互效果时。对于初学者来说,掌握这套技术组合是进入 web 开发领域的坚实...
在这个压缩包中,我们有四个文件,都是围绕着这个主题,旨在帮助初学者掌握基础的DIV+CSS布局技巧。 1. **Div+CSS布局入门教程(一二三四).doc**: 这可能是一个分章节的文档教程,详细介绍了如何使用DIV元素进行...
本学习文档旨在深入解析`DIV+CSS`的核心概念,帮助初学者理解并掌握这一技术。 一、什么是DIV? `DIV`是HTML中的一个标签,全称为“Division”,即分隔或区域。它是一个块级元素,用于将网页内容分割成独立的、可...