1.在区块线边框添加一条水平线
例如：<div style:"height :300px;width:800px;border-bottom: solid 1px orange ;">
//border-bottom: 边境底部 solid 实线 1px 像素为1 orange 颜色为橙色
2.在区块中设置背景图片
例如：<div style=" background: url(img/all_bg_index2.png);">
3.margin 标签
margin-top ; 边框到顶部的距离；
4.文档流
写html，css的同学应该需要清楚什么是文档流。文档流：将窗体自上而下分成一行一行,
并在每行中按从左至右的挨次排放元素,即为文档流。
5.脱离文档流的三种状态
有三种状况将使得元素离开文档流而存在,分别是浮动、绝对定位、固定定位.
然则在IE中浮动元素也存在于文档流中。
6.常用十六进制颜色对照表代码查询
| 16位进制代码 |
颜色效果 |
| |
|
| #FFFFFF |
|
| #FFFFCC |
|
| #FFFF99 |
|
| #FFFF66 |
|
| #FFFF33 |
|
| #FFFF00 |
|
| #FFCCFF |
|
| #FFCCCC |
|
| #FFCC99 |
|
| #FFCC66 |
|
| #FFCC33 |
|
| #FFCC00 |
|
| #FF99FF |
|
| #FF99CC |
|
| #FF9999 |
|
| #FF9966 |
|
| #FF9933 |
|
| #FF9900 |
|
| #FF66FF |
|
| #FF66CC |
|
| #FF6699 |
|
| #FF6666 |
|
| #FF6633 |
|
| #FF6600 |
|
| #FF33FF |
|
| #FF33CC |
|
| #FF3399 |
|
| #FF3366 |
|
| #FF3333 |
|
| #FF3300 |
|
| #FF00FF |
|
| #FF00CC |
|
| #FF0099 |
|
| #FF0066 |
|
| #FF0033 |
|
| #FF0000 |
|
| |
| Hex Code |
Color |
| #66FFFF |
|
| #66FFCC |
|
| #66FF99 |
|
| #66FF66 |
|
| #66FF33 |
|
| #66FF00 |
|
| #66CCFF |
|
| #66CCCC |
|
| #66CC99 |
|
| #66CC66 |
|
| #66CC33 |
|
| #66CC00 |
|
| #6699FF |
|
| #6699CC |
|
| #669999 |
|
| #669966 |
|
| #669933 |
|
| #669900 |
|
| #6666FF |
|
| #6666CC |
|
| #666699 |
|
| #666666 |
|
| #666633 |
|
| #666600 |
|
| #6633FF |
|
| #6633CC |
|
| #663399 |
|
| #663366 |
|
| #663333 |
|
| #663300 |
|
| #6600FF |
|
| #6600CC |
|
| #660099 |
|
| #660066 |
|
| #660033 |
|
| #660000 |
|
|
|
| 16位进制代码 |
颜色效果 |
| |
|
| #CCFFFF |
|
| #CCFFCC |
|
| #CCFF99 |
|
| #CCFF66 |
|
| #CCFF33 |
|
| #CCFF00 |
|
| #CCCCFF |
|
| #CCCCCC |
|
| #CCCC99 |
|
| #CCCC66 |
|
| #CCCC33 |
|
| #CCCC00 |
|
| #CC99FF |
|
| #CC99CC |
|
| #CC9999 |
|
| #CC9966 |
|
| #CC9933 |
|
| #CC9900 |
|
| #CC66FF |
|
| #CC66CC |
|
| #CC6699 |
|
| #CC6666 |
|
| #CC6633 |
|
| #CC6600 |
|
| #CC33FF |
|
| #CC33CC |
|
| #CC3399 |
|
| #CC3366 |
|
| #CC3333 |
|
| #CC3300 |
|
| #CC00FF |
|
| #CC00CC |
|
| #CC0099 |
|
| #CC0066 |
|
| #CC0033 |
|
| #CC0000 |
|
| |
| Hex Code |
Color |
| #33FFFF |
|
| #33FFCC |
|
| #33FF99 |
|
| #33FF66 |
|
| #33FF33 |
|
| #33FF00 |
|
| #33CCFF |
|
| #33CCCC |
|
| #33CC99 |
|
| #33CC66 |
|
| #33CC33 |
|
| #33CC00 |
|
| #3399FF |
|
| #3399CC |
|
| #339999 |
|
| #339966 |
|
| #339933 |
|
| #339900 |
|
| #3366FF |
|
| #3366CC |
|
| #336699 |
|
| #336666 |
|
| #336633 |
|
| #336600 |
|
| #3333FF |
|
| #3333CC |
|
| #333399 |
|
| #333366 |
|
| #333333 |
|
| #333300 |
|
| #3300FF |
|
| #3300CC |
|
| #330099 |
|
| #330066 |
|
| #330033 |
|
| #330000 |
|
|
|
| 16位进制代码 |
颜色效果 |
| |
|
| #99FFFF |
|
| #99FFCC |
|
| #99FF99 |
|
| #99FF66 |
|
| #99FF33 |
|
| #99FF00 |
|
| #99CCFF |
|
| #99CCCC |
|
| #99CC99 |
|
| #99CC66 |
|
| #99CC33 |
|
| #99CC00 |
|
| #9999FF |
|
| #9999CC |
|
| #999999 |
|
| #999966 |
|
| #999933 |
|
| #999900 |
|
| #9966FF |
|
| #9966CC |
|
| #996699 |
|
| #996666 |
|
| #996633 |
|
| #996600 |
|
| #9933FF |
|
| #9933CC |
|
| #993399 |
|
| #993366 |
|
| #993333 |
|
| #993300 |
|
| #9900FF |
|
| #9900CC |
|
| #990099 |
|
| #990066 |
|
| #990033 |
|
| #990000 |
|
| |
| Hex Code |
Color |
| #00FFFF |
|
| #00FFCC |
|
| #00FF99 |
|
| #00FF66 |
|
| #00FF33 |
|
| #00FF00 |
|
| #00CCFF |
|
| #00CCCC |
|
| #00CC99 |
|
| #00CC66 |
|
| #00CC33 |
|
| #00CC00 |
|
| #0099FF |
|
| #0099CC |
|
| #009999 |
|
| #009966 |
|
| #009933 |
|
| #009900 |
|
| #0066FF |
|
| #0066CC |
|
| #006699 |
|
| #006666 |
|
| #006633 |
|
| #006600 |
|
| #0033FF |
|
| #0033CC |
|
| #003399 |
|
| #003366 |
|
| #003333 |
|
| #003300 |
|
| #0000FF |
|
| #0000CC |
|
| #000099 |
|
| #000066 |
|
| #000033 |
|
| #000000 |
|
|
| |
|
|
红色和粉红色，以及它们的16进制代码。
|
| #990033 |
#CC6699 |
#FF6699 |
#FF3366 |
#993366 |
#CC0066 |
#CC0033 |
#FF0066 |
| #FF3399 |
#FF9999 |
#FF99CC |
#FF0099 |
#CC3366 |
#FF66CC |
#FF33CC |
#FFCCFF |
| #FF0033 |
#FF00CC |
#CC3399 |
#FF99FF |
|
紫红色，以及它们的16进制代码。
|
| #FF66FF |
#CC33CC |
#CC00FF |
#FF33FF |
#CC99FF |
#9900CC |
#FF00FF |
#CC66FF |
| #CC33FF |
#CC99CC |
#990066 |
#993399 |
#CC66CC |
#CC00CC |
#663366 |
#CC0099 |
| #990099 |
| 蓝色，以及它们的16进制代码。 |
| #660099 |
#666FF |
#000CC |
#9933CC |
#666699 |
#660066 |
#333366 |
#0066CC |
| #99CCFF |
#9933FF |
#330099 |
#6699FF |
#9966CC |
#3300CC |
#003366 |
#330033 |
| #663399 |
#3333FF |
#006699 |
#6633CC |
#3333CC |
#3399CC |
#6600CC |
#0066FF |
| #0033FF |
#66CCFF |
#330066 |
#3366FF |
#3399FF |
#6600FF |
#3366CC |
#6699CC |
| #0099FF |
#CCCCFF |
#000033 |
#33CCFF |
#9999FF |
#0000FF |
#00CCFF |
#9999CC |
| #0033CC |
#3300FF |
#333399 |
#000099 |
#000066 |
#6633FF |
#003399 |
#6666CC |
| #0099CC |
#9900FF |
#9966FF |
| 黄色、褐色、玫瑰色和橙色，以及它们的16进制代码。 |
| #FFFFCC |
#FFCC00 |
#CC99090 |
#663300 |
#FF6600 |
#663333 |
#CC6666 |
#FF6666 |
| #FFCC66 |
#FF9900 |
#FF9966 |
#CC3300 |
#996666 |
#FFCCCC |
#660000 |
#FF3300 |
| #CC6600 |
#FF6633 |
#996633 |
#CC9999 |
#FF3333 |
#990000 |
#CC9966 |
#FFFF33 |
| #FF9933 |
#330000 |
#993333 |
#CC3333 |
#CC0000 |
#FFCC99 |
#FFFF00 |
#996600 |
| #993300 |
#FF0000 |
#CC6633 |
#CC9933 |
#FFCC33 |
#FFFF99 |
| 绿色，以及它们的16进制代码。 |
| #99FFFF |
#33CCCC |
#00CC99 |
#99FF99 |
#009966 |
#33FF33 |
#33FF00 |
#99CC33 |
| #66CCCC |
#66FFCC |
#66FF66 |
#009933 |
#00CC33 |
#66FF00 |
#336600 |
#33300 |
| #99FFCC |
#339933 |
#33FF66 |
#33CC33 |
#99FF00 |
#669900 |
#666600 |
#00FFFF |
| #99CC99 |
#00FF66 |
#66FF33 |
#66CC00 |
#99CC00 |
#999933 |
#00CCCC |
#006666 |
| #CCFFCC |
#00FF00 |
#00CC00 |
#CCFF66 |
#CCCC66 |
#009999 |
#003333 |
#006633 |
| #66CC33 |
#33CC00 |
#CCFF33 |
#666633 |
#669999 |
#00FFCC |
#336633 |
#33CC66 |
| #339900 |
#CCFF00 |
#999966 |
#99CCCC |
#33FFCC |
#669966 |
#00CC66 |
#99FF33 |
| #999900 |
#CCCC99 |
#CCFFFF |
#33CC99 |
#66CC66 |
#66CC99 |
#00FF33 |
#009900 |
| #CCCC00 |
#CCC33 |
#336666 |
#006600 |
#003300 |
#669933 |
#339966 |
#339999 |
| #669900 |
#99CC66 |
#99FF66 |
#00FF99 |
#33FF99 |
#66FF99 |
#CCFF99 |
#33FFFF |
| #66FFFF |
| 白色、灰色和黑色，以及它们的16进制代码。 |
| #FFFFF |
#CCCCCC |
#999999 |
#666666 |
#333333 |
#000000 |
| 16色和它们的16进制代码。 |
| Aqua |
Black |
Fuchsia |
Gray |
Gree |
Lime |
Maroon |
Navy |
| Red |
Silver |
Teal |
White |
Yellow |
Blue |
Olive |
Purple
|
|
- 关于 静态页面布局 中的一些BUG
作为一枚初级程序猿,难免在制作静态页面时会遇到一些BUG,在此,我从网上找了一些资料并且结合自己的项目开发经验,总结了一些在静态页面布局时可能会遇到的问题,希望能对初级程序猿有一定的帮助(资料请参考: ...
- 用phpcms如何将静态页面制作成企业网站，头部加尾部
首先,先要准备好这个静态网页的源文件,如图 bs里面是一些css和js的文件,img则是放图片的,文件中的index是网页的首页 运行一下,看看 是这样的 然后打开phpcms文件,上篇博客中有提到, ...
- 用phpcms如何将静态页面制作成企业网站（上）
首先,先要准备好这个静态网页的源文件,如图 bs里面是一些css和js的文件,img则是放图片的,文件中的index是网页的首页 运行一下,看看 是这样的 然后打开phpcms文件,上篇博客中有提到, ...
- 仿新浪首页、主题、详情页，纯html静态页面
仿新浪首页.主题.详情页.纯html静态页面,下载地址: http://download.csdn.net/detail/sweetsuzyhyf/8085535
- silverlight visifire控件图表制作——silverlight 静态页面xaml
一.silverlight 静态页面 1. 时间控件:DatePicker ,添加引用: xmlns:sdk="clr-namespace:System.Windows.Controls;a ...
- 用phpcms如何将静态页面制作成企业网站（中）
上篇博客中讲到了该修改网页的中间部分 中间的内容是这样的,有标题和内容,里面的内容被代码替代,运行起来就这样的 里面的内容就可以在后台管理那里添加 再来看代码部分 <div class=&quo ...
- 用phpcms如何将静态页面制作成企业网站（下）
上篇讲到了子页部分 这样的 有分页选择 列表项的代码部分 最后输出变量pages就可以了 看一下运行的效果 点击下一页 再来改一下子页显示的样式 点击人才将会出来的一个子页面 路径要统一 再来更改后台 ...
- 浅谈php生成静态页面
一.引 言 在速度上,静态页面要比动态页面的比方php快很多,这是毫无疑问的,但是由于静态页面的灵活性较差,如果不借助数据库或其他的设备保存相关信息的话,整体的管理上比较繁琐,比方修改编辑.比方阅读权 ...
- 比较详细PHP生成静态页面教程
一,PHP脚本与动态页面. PHP脚本是一种服务器端脚本程序,可通过嵌入等方法与HTML文件混合, 也可以类,函数封装等形式,以模板的方式对用户请求进行处理.无论以何种方式,它的基本原理是这样的.由客 ...
随机推荐
- lintcode-42-最大子数组 II
42-最大子数组 II 给定一个整数数组,找出两个 不重叠 子数组使得它们的和最大. 每个子数组的数字在数组中的位置应该是连续的. 返回最大的和. 注意事项 子数组最少包含一个数 样例 给出数组 [1 ...
- Hive整体优化策略
一 整体架构优化 现在hive的整体框架如下,计算引擎不仅仅支持Map/Reduce,并且还支持Tez.Spark等.根据不同的计算引擎又可以使用不同的资源调度和存储系统. 整体架构优化点: 1 根据 ...
- 按Backspace键删除时，会出现^H
按Backspace键删除时,会出现^H 2014-08-12 19:38 1180人阅读 评论(0) 举报 版权声明:本文为博主原创文章,未经博主允许不得转载. 在linux/unix 平台的经常使 ...
- 【.NET】- Task.Run 和 Task.Factory.StartNew 区别
Task.Run 是在 dotnet framework 4.5 之后才可以使用, Task.Factory.StartNew 可以使用比 Task.Run 更多的参数,可以做到更多的定制. 可以认为 ...
- Flink的序列化与flink-hadoop-compatibility
最近 用户提交了一个问题 说他的jar包里明明包含相关的类型 但是在提交Flink作业的时候 却报出classnotfound的错误 查看之后发现 这里是flink的一个没有说的太明白的地方 用户的代 ...
- 织梦CMS建站入门学习（二）
织梦建站的数据库设计: 1.模型表:根据网站的需求,建立不同的数据模型,如:文章浏览,软件下载,视频观看等等. 2.栏目表:根据网站的需求,建立不同的栏目,每一个栏目选择一个数据模型. 3.内容主表: ...
- ::before和::after 常见的用法
.lizi:after{ content: "I'M after"; /*插入字符串*/ content: "attr(id)"; /*插入当前元素属性*/ ...
- 【Python】python和json数据相互转换,json读取和写入,repr和eval()使用
python数据转换json 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 import jso ...
- UIKit中的几个核心对象的介绍:UIApplication,UIWindow,UIViewController,UIView(layer)简单介绍
UIApplication,UIWindow,UIViewController,UIView(layer)简单介绍 一:UIApplication:单例(关于单例后面的文章中会详细介绍,你现在只要知道 ...
- A表数据插入到B表（表结构不一致）
D_A 有E\F\H 3字段 D_B 有 A\B\C\D\E\ID 字段 将 D_B 个别字段插入到D_A 表 INSERT INTO D_A(E,F,H) select B,A,ID from ...
