初学DIV+CSS要记住的
初学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问题
关于这点,不知那位高人把CSS BUG变成顺口溜了!在这里引用一下,很容易记住的!
1、IE边框若显若无,须注意,定是高度设置已忘记;
2、浮动产生有缘故,若要父层包含住,紧跟浮动要清除,容器自然显其中;
3、三像素文本慢移不必慌,高度设置帮你忙;
4、兼容各个浏览须注意,默认设置行高可能是杀手;
5、独立清除浮动须铭记,行高设无,高设零,设计效果兼浏览;
6、学布局须思路,路随布局原理自然直,轻松驾驭html,流水布局少hack,代码清爽,兼容好,友好引擎喜欢迎。
三、所有标签皆有源
只是默认各不同,span是无极,无极生两仪—内联和块级,img较特殊,但也遵法理,其他只是改造各不同,一个*号全归原,层叠样式理须多练习,万物皆规律。
四、图片链接排版须小心
图片链接文字链接若对齐,padding和vertical-align:middle要设定,虽差微细倒无妨。
五、IE浮动双边距
请用display:inline。
六、列表横向排版
列表代码须紧靠,空隙自消须铭记。
DIC+CSS学习是一条很长的路,真正走下去必须要有一颗虔诚的信心!
初学DIV+CSS要记住的的更多相关文章
- (转)div+css 布局经验 - 最简单的 = 最不变形的(原创技巧)
站酷几年了 一直饱受其恩泽 尤为感激 一直想奉献些什么 但是苦于水平 苦于奔波 今天静下心来 为大家奉献下 自己的div+css 经验 ,以下观点只代表 深海个人立场 希望为初学者提供一条" ...
- div+css 布局经验 - 最简单的 = 最不变形的(原创技巧)
站酷几年了 一直饱受其恩泽 尤为感激 一直想奉献些什么 但是苦于水平 苦于奔波 今天静下心来 为大家奉献下 自己的div+css 经验 ,以下观点只代表 深海个人立场 希望为初学者提供一条" ...
- 2天驾驭DIV+CSS (实战篇)(转)
这是去年看到的一片文章,感觉在我的学习中,有不少的影响.于是把它分享给想很快了解css的兄弟们.本文是实战篇. 基础篇[知识一] “DIV+CSS” 的叫法是不准确的[知识二] “DIV+CSS” ...
- 2天驾驭DIV+CSS (基础篇)(转)
这是去年看到的一片文章,感觉在我的学习中,有不少的影响.于是把它分享给想很快了解css的兄弟们. 基础篇[知识一] “DIV+CSS” 的叫法是不准确的[知识二] “DIV+CSS” 将你引入两大误区 ...
- DIV CSS布局中position属性用法深入探究
本文向大家描述一下DIV CSS布局中的position属性的用法,position属性主要有四种属性值,任何元素的默认position的属性值均是static,静态.这节课主要讲讲relative( ...
- 各种div+css居中方式调整(转载)
盘点8种CSS实现垂直居中水平居中的绝对定位居中技术 分类: 前端开发2013-09-11 21:06 24959人阅读 评论(3) 收藏 举报 绝对居中垂直居中水平居中CSS居中代码 目录(?) ...
- html(第一天,div+css)
一.CSS布局属性 Width:设置对象的宽度(width:45px). Height:设置对象的高度(Height:45px;). Background:设置对象的背景颜色.背景图像. 1.背景颜色 ...
- <转载>Div+Css布局教程(-)CSS必备知识
目录: 1.Div+Css布局教程(-)CSS必备知识 注:本教程要求对html和css有基础了解. 一.CSS布局属性 Width:设置对象的宽度(width:45px). Height:设置对象的 ...
- 标准之路网站上一篇文章《十天学会web标准(div+css)》的营养精华
以下精华出自如下链接,“http://www.aa25.cn/special/10day/index.shtml”,<十天学会web标准(DIV+CSS)>. 这个内容不要删掉:“< ...
随机推荐
- 第二章实例:Android窗口菜单显示
package test.main.cls; import com.example.popupwindow.R; import android.app.Activity; import android ...
- 【转】SSIS 2012 – Package Configurations Menu Option Missing
原文:http://dataqueen.unlimitedviz.com/2012/01/ssis-2012-package-configurations-menu-option-missing/ I ...
- iOS 使用自定义的字体
一.新建一个工程,准备好要使用的字体,后缀为.ttf或者.otf格式. 二.将字体直接拖入工程项目中. 三.在Info.plist中添加一个新的Key:Fonts provided by applic ...
- eclipse使用Git插件
折腾了会Git,记录一下下. 1.安装Git Help-->Install New Software 点击Add,Name随意,Location为http://download.eclips ...
- Struts2 工作流程
Struts2使用了WebWork的设计核心(XWork),在内部使用拦截器处理用户请求,从而允许用户业务逻辑控制器和ServletAPI分离.Struts2内部是一个MVC架构,Struts2 的核 ...
- Ubuntu系统下创建python数据挖掘虚拟环境
虚拟环境: 虚拟环境是用于创建独立的python环境,允许我们使用不同的python模块和版本,而不混淆. 让我们了解一下产品研发过程中虚拟环境的必要性,在python项目中,显然经常要使用不 ...
- angular 入门教程1
使用angularjs也有一年之久了.从初识angularjs时的激动和兴奋到现在淡定的使用,这其中也是有不少的心酸(刚用的时候和各种js插件的配合使用快把我弄疯了). 细想起来.用MVVM的这种js ...
- SQL Sever MYSQL 视图实现的 2 种方式
前期准备: 1.create table person # 假设这张表用来收录所以有地球人的基本信息. (ID bigint , Name varchar(16), Country varchar( ...
- 【深夜急报,Win10下的Linux子系统之Bash】
[在Windows下进行的编程人员,你真的需要学习下Linux] 手册:<Linux 命令手册(特洛伊版2.0)> 链接: https://pan.baidu.com/s/1skrVSvV ...
- JVM 看不到某些异常的stacktrace问题(转)
在java 1.5的release notes里面可以看到这样一句话: The compiler in the server VM now provides correct stack backtra ...