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文件混合, 也可以类,函数封装等形式,以模板的方式对用户请求进行处理.无论以何种方式,它的基本原理是这样的.由客 ...
随机推荐
- Thrift IDL使用方式
I.背景 众所周知,Thrift是一个RPC的框架,其可用于不同语言之间的服务相互调用.比如最近接触到的一个运用环境: *前端使用Node.Js重构了部分我们的老旧代码(前后端未分离的SpringBo ...
- 《剑指offer》---输出链表倒数第k个结点
本文算法使用python3实现 1 题目描述: 输入一个链表,输出该链表中倒数第k个结点. 时间限制:1s:空间限制:32768K 2 思路描述: 方法一:当链表长度为 $ n $ 时,输 ...
- LintCode-159.寻找旋转排序数组中的最小值
寻找旋转排序数组中的最小值 假设一个旋转排序的数组其起始位置是未知的(比如0 1 2 4 5 6 7 可能变成是4 5 6 7 0 1 2). 你需要找到其中最小的元素. 你可以假设数组中不存在重复的 ...
- iOS单利创建的方法
我们在使用单例的时候有两种方法@synchronized,GCD,往往人们使用@synchronized,但是推荐使用GCD: 第一种(@synchronized): + (id)sharedInst ...
- MindManager2018 修改过期时间 配置文件路径
路径:C:\Users\likui\AppData\Roaming\MindManager\MindManager2018.ini 文件中记录了安装时间和最后一次启动时间. [MindManager] ...
- Java接口成员变量
定义接口 使用interface来定义一个接口.接口定义同类的定义类似,也是分为接口的声明和接口体,当中接口体由常量定义和方法定义两部分组成.定义接口的基本格式例如以下: [修饰符] inter ...
- 在select中，载入时默认select为空白，选项内不显示空白项
有两种办法,一种纯css实现,一种借助js实现. html: <body onload="load()"> <select id="abc" ...
- java计算某日期之后的日期
public static void main(String[] args) { // 时间表示格式可以改变,yyyyMMdd需要写例如20160523这种形式的时间 SimpleDateFormat ...
- bzoj3168-钙铁锌硒维生素
题目 这道题的题意理解很重要,直接写原题了. 小林把人体需要的营养分成了\(n\)种,他准备了2套厨师机器人,一套厨师机器人有\(n\)个,每个厨师机器人只会做一道菜,这道菜一斤能提供第\(i\)种营 ...
- 【poj2104】K-th Number 主席树
题目描述 You are working for Macrohard company in data structures department. After failing your previou ...
