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文件混合, 也可以类,函数封装等形式,以模板的方式对用户请求进行处理.无论以何种方式,它的基本原理是这样的.由客 ...
随机推荐
- 第四课——MFC应用程序框架
一.MFC应用程序类型 上篇文章的彩蛋:可通过使用MFC应用程序向导(MFC AppWizard)的功能来创建所需要的应用程序,这意味着不需要输入任何代码.MFC除了应用程序向导,还对应用程序项目有着 ...
- Acm hust 1.25
闲着无聊做了点hust上 acm的训练题 A题 http://acm.hust.edu.cn/vjudge/contest/view.action?cid=104738#problem/A 看了20分 ...
- 项目--uml
[团队信息] 团队项目: 小葵日记--主打记录与分享模式的日记app 队名:日不落战队 队员信息及贡献分比例: 短学号 名 本次作业博客链接 此次作业任务 贡献分配 备注 501 安琪 http:// ...
- 【Docker 命令】- rm命令
docker rm :删除一个或多少容器 语法 docker rm [OPTIONS] CONTAINER [CONTAINER...] OPTIONS说明: -f :通过SIGKILL信号强制删除一 ...
- ubuntu 16.04 安装jdk9错误
转自:https://askubuntu.com/questions/769467/can-not-install-openjdk-9-jdk-because-it-tries-to-overwrit ...
- Git 应用补丁报错 “sha1 information is lacking or useless”
因为现场代码在客户局域网内,不能连接到公司网络,所以一般更新的时候都是打补丁, 然后在客户现场应用补丁,但是最近在应用补丁的时候出现了如下问题: ... fatal: sha1 information ...
- 第51天：封装可视区域大小函数client
一.client 可视区域 offsetWidth: width + padding + border (披着羊皮的狼) clientWidth: width + ...
- 【BZOJ1941】Hide and Seek（KD-Tree）
[BZOJ1941]Hide and Seek(KD-Tree) 题面 BZOJ 洛谷 题解 \(KD-Tree\)对于每个点搜一下最近点和最远点就好了 #include<iostream> ...
- POJ2987：Firing——题解
http://poj.org/problem?id=2987 题目大意: 炒掉一个人能够获得b收益(b可以<0),但是炒掉一个人必须得炒掉他的下属(然后继续递归). 求最大收益和此时最小裁员. ...
- BZOJ5321 & 洛谷4064 & LOJ2274：[JXOI2017]加法——题解
https://www.lydsy.com/JudgeOnline/problem.php?id=5321 https://www.luogu.org/problemnew/show/P4064 ht ...
