网页设计布局原则
发布时间:2010-04-20 17:18:00
标签:CSS布局,设计,网页设计
1.样式的重用性
CSS布局的网页最大的特点就是样式的可重用性,利用class选择符重复将某个样式属性多次在网页中使用,以减少不断定义样式属性的烦琐工作,增加页面的可维护性。例如,将某处表达样式、板块整体样式、文字颜色;甚至可以扩展到页面的模块化处理。
2.浮动与清除浮动
浮动式网页布局中永远的话题,很多浏览器的兼容性问题都是因为浮动而导致的,例如IE6.0的双倍间距的问题。浮动也是把 * 刀,兼容性的问题为其二产生为其而灭亡,善于利用浮动对于网页布局将会带来很到的帮助,例如使用负边距地方法对页面进行布局设计。
清除浮动浮动而出现,用来清理浮动导致的诸多问题。清除浮动的方式有很多。
3.定位方式的页面布局
定位方式的布局一般指的是绝对定位,这种布局方式对页面布局的设计精确性要求十分高,遗憾的是绝对定位的布局方式的盒模型是固定高和宽的,无非自适应。
4.不要过多使用ID选择符
ID在一个页面中出现的次数是一次,过多使用将失去样式的可重用性的特征,对于页面的可维护性也将大打折扣。
5.类选择符(class)及ID选择符使用字母+数字方式命名
类选择符Class及ID选择符的命名方式很多,最好的方式是阵对某个模块的功能阐述性的命名,例如,阵对主要内容区域,可以使用#mainBox或者.mainBox而不是使用#box1或者.box1。
不使用字母+数字的方式命名,在后期维护中可以阵对某个模块主要针对对象一目了然。
6.合理使用CSS布局,切勿盲目使用
CSS样式的主要功能是对页面结构样式的处理,避免只是为了试验一种技术或新技巧而采用CSS中的技巧去剥夺其他语言脚本的使用。


猜你喜欢
- 问题介绍棋盘覆盖问题,是一种编程问题。如何应用分治法求解棋盘覆盖问题呢?分治的技巧在于如何划分棋盘,使划分后的子棋盘的大小相同,并且每个子棋
- 作为一个.net后台开发的程序猿,博客里既然大多都是前端相关的博文。是不是该考虑换方向了,转前端开发得了 ...小小吐槽一下,近期受该不该跳
- Python的 eval() 允许从基于字符串或基于编译代码的输入中计算任意Python表达式。当从字符串或编译后的代码
- 使用环境 C#VSCodeM11. 安装MySQL下载MySQL软件,傻瓜式安装即可,安装完之后,在系统偏好号设置里会出现一个My
- 本文实例讲述了Python实现读取及写入csv文件的方法。分享给大家供大家参考,具体如下:新建csvData.csv文件,数据如下:具体代码
- 前言本文主要使用 cpu 版本的 tensorflow 2.4 版本完成文本的 word embedding 训练,并且以此为基础完成影评文
- HTTP_X_FORWARDED_FOR与REMOTE_ADDR的区别.在Request.ServerVariables中并没有HTTP_X
- 如题,我们直接使用numpy#!D:/workplace/python# -*- coding: utf-8 -*-# @File : nu
- 本文介绍基于Python中seaborn模块,实现联合分布图绘制的方法。联合分布(Joint Distribution)图是一种查看两个或两
- 官方文档:需求:当1个job启动构建后,获取它的构建状态.(成功,失败,驳回,构建中,正在排队)关键函数:获取job是否在排队的结果获取正在
- 字段是Python是字典中唯一的键-值类型,是Python中非常重要的数据结构,因其用哈希的方式存储数据,其复杂度为O(1),速度非常快。下
- JavaScript 没有一个权威的编码风格指南,取而代之的是一些流行的编码风格:Google的JavaScript风格指南(以下简称Goo
- 本文实例为大家分享了Python管理Windows服务的具体代码,供大家参考,具体内容如下#!/usr/bin/python# encodi
- 本文实例为大家分享了js实现鼠标切换图片的具体代码,供大家参考,具体内容如下实现效果,可以利用鼠标移动在对应的小点点上,或者点击左右两侧的箭
- 多线程多线程类似于同时执行多个不同程序,多线程运行有如下优点:使用线程可以把占据长时间的程序中的任务放到后台去处理。用户界面可以更加吸引人,
- 本文实例讲述了Python中subprocess模块用法。分享给大家供大家参考。具体如下:执行命令:>>> subproc
- 本文实例为大家分享了JS HTML5拖拽上传图片预览的具体代码,供大家参考,具体内容如下1.文件API:(File API)file类型的的
- stark组件是仿照django的admin模块开发的一套组件,它的作用是在网页上对注册的数据表进行增删改查操作一、配置1、创建
- 一、python线程的模块1.1 thread和threading模块thread模块提供了基本的线程和锁的支持threading提供了更高
- tkinter库Canvas操作三个实例实例一:涂鸦import tkinter as tkimport pyautogui as agfr