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

html 制作静态页面新知识的更多相关文章

  1. 关于 静态页面布局 中的一些BUG

    作为一枚初级程序猿,难免在制作静态页面时会遇到一些BUG,在此,我从网上找了一些资料并且结合自己的项目开发经验,总结了一些在静态页面布局时可能会遇到的问题,希望能对初级程序猿有一定的帮助(资料请参考: ...

  2. 用phpcms如何将静态页面制作成企业网站,头部加尾部

    首先,先要准备好这个静态网页的源文件,如图 bs里面是一些css和js的文件,img则是放图片的,文件中的index是网页的首页 运行一下,看看 是这样的 然后打开phpcms文件,上篇博客中有提到, ...

  3. 用phpcms如何将静态页面制作成企业网站(上)

    首先,先要准备好这个静态网页的源文件,如图 bs里面是一些css和js的文件,img则是放图片的,文件中的index是网页的首页 运行一下,看看 是这样的 然后打开phpcms文件,上篇博客中有提到, ...

  4. 仿新浪首页、主题、详情页,纯html静态页面

    仿新浪首页.主题.详情页.纯html静态页面,下载地址: http://download.csdn.net/detail/sweetsuzyhyf/8085535

  5. silverlight visifire控件图表制作——silverlight 静态页面xaml

    一.silverlight 静态页面 1. 时间控件:DatePicker ,添加引用: xmlns:sdk="clr-namespace:System.Windows.Controls;a ...

  6. 用phpcms如何将静态页面制作成企业网站(中)

    上篇博客中讲到了该修改网页的中间部分 中间的内容是这样的,有标题和内容,里面的内容被代码替代,运行起来就这样的 里面的内容就可以在后台管理那里添加 再来看代码部分 <div class=&quo ...

  7. 用phpcms如何将静态页面制作成企业网站(下)

    上篇讲到了子页部分 这样的 有分页选择 列表项的代码部分 最后输出变量pages就可以了 看一下运行的效果 点击下一页 再来改一下子页显示的样式 点击人才将会出来的一个子页面 路径要统一 再来更改后台 ...

  8. 浅谈php生成静态页面

    一.引 言 在速度上,静态页面要比动态页面的比方php快很多,这是毫无疑问的,但是由于静态页面的灵活性较差,如果不借助数据库或其他的设备保存相关信息的话,整体的管理上比较繁琐,比方修改编辑.比方阅读权 ...

  9. 比较详细PHP生成静态页面教程

    一,PHP脚本与动态页面. PHP脚本是一种服务器端脚本程序,可通过嵌入等方法与HTML文件混合, 也可以类,函数封装等形式,以模板的方式对用户请求进行处理.无论以何种方式,它的基本原理是这样的.由客 ...

随机推荐

  1. Red and Black(DFS深搜实现)

    Description There is a rectangular room, covered with square tiles. Each tile is colored either red ...

  2. Linux GCC编译

    .a 静态库(打包文件 由多个.o文件打包而成) .c 未经过预处理的C源码 .h C头文件 .i 经过预处理的C源码(将头文件内容加载到c文件中) .o 编译之后产生的目标文件 .s 生成的汇编语言 ...

  3. Git使用笔记一(关于如何设置密钥及提交)(Windows)

    如何设置密钥 ssh-keygen -t rsa或ssh-keygen -t rsa -C ‘邮箱’ (注意 1.-t前有一个空格:2.keygen是key generate的缩写:3.而后连续输入三 ...

  4. Thinkphp5图片、音频和视频文件上传

    首先是同步上传,最为基础的上传的方式,点击表单提交之后跳转那种.如下前端代码 <!DOCTYPE html> <html lang="en"> <he ...

  5. vim map nmap(转)

    转自:http://blog.csdn.net/taoshengyang/article/details/6319106 有五种映射存在  - 用于普通模式: 输入命令时.  - 用于可视模式: 可视 ...

  6. C/C++打印堆栈信息

    转自:http://www.cnblogs.com/zhurizhe/p/3412369.html 在C/C++程序中打印当前函数调用栈 前几天帮同事跟踪的一个程序莫名退出,没有core dump(当 ...

  7. Python2中编码错误---重组人表皮生长因子凝胶(易孚格式转化为UTF-8

    在python2的使用中,总会遇到各种各样的编码问题,这也是使用Python2最头疼的一件事情,幸好python3解决了编码的问题. 下面我在爬虫时遇到的类似重组人表皮生长 ...

  8. 如何设计好的RESTful API之安全性

    保证RESTful API的安全性,主要包括三大方面: a) 对客户端做身份认证 b) 对敏感的数据做加密,并且防止篡改 c) 身份认证之后的授权 1.对客户端做身份认证,有几种常见的做法: 1)在请 ...

  9. query 获取本身的HTML

    <div class="test"><p>hello,你好!</p></div> <script> $(".t ...

  10. RT-thread 设备驱动组件之SPI设备

    本文主要介绍RT-thread中的SPI设备驱动,涉及到的文件主要有:驱动框架文件(spi_dev.c,spi_core.c,spi.h),底层硬件驱动文件(spi_hard.c,spi_hard.h ...