随笔分类 -  DIV+CSS

如何实现导航菜单栏中的二级下拉菜单？
摘要：我们在淘宝、搜狐等大型网站上都可以看到使用的一些二级下拉菜单，比如下面这张图片。 但是如何实现类似的图片呢？实际上，我们有至少三种方式来实现，下面，我附上代码供大家参考。 1.仅使用html和css <meta charset="UTF-8"> <title>Document</title> <st 阅读全文
posted @ 2019-03-31 09:58 柳志军 阅读(1875) 评论(0) 推荐(0) 编辑
27 ,布局
摘要：1. 流体浮动布局 2. 流体定位布局 3. 固定浮动布局 4. 固定定位布局 1. 流体浮动布局 规格：当视窗变化时跟着变化 采用：浮动布局 兼容：兼容当前主流浏览器 . 2. 流体定位布局 规格：当视窗变化时跟着变化 采用：定位布局 兼容：兼容当前主流浏览器 . 3. 固定浮动布局 规格：固定大 阅读全文
posted @ 2019-03-31 09:24 柳志军 阅读(397) 评论(0) 推荐(0) 编辑
26 , CSS 构造表单
摘要：1. 表单标签使用 2. 下拉菜单背景 3. 滚动条的使用 4. 结构化表单布局 1 1 1 1. . . . 表单标签的使用 <label for=”name”>姓名: <input type=”text” name=”name”id=”name”/> 2 2 2 2. . . . 去掉默认的表单 阅读全文
posted @ 2019-03-31 09:17 柳志军 阅读(168) 评论(0) 推荐(0) 编辑
25 ,CSS 构造表格
摘要：1. 表格的基础构造 2. 边距和边线应用 3. 隐藏和删除应用 1. 简单表格 table { width:auto; border-collapse:collapse; margin-left:20px; border:1px solid black; } td,th { width:50px; 阅读全文
posted @ 2019-03-31 09:12 柳志军 阅读(169) 评论(0) 推荐(0) 编辑
24, CSS 构造超链接
摘要：1. 超链接边框 2. 派生超链接 3. 属性选择器超链接 4. 动态超链接 5. 图像翻转超链接 6. CSS 工具提示 1.给链接加上边框 A:link { Color: #f00; Text-decoration: none; Border-bottom: 1px dashed #333; L 阅读全文
posted @ 2019-03-31 09:05 柳志军 阅读(459) 评论(0) 推荐(0) 编辑
23 , CSS 构造列表与导航
摘要：1. 列表图片 2. 背景列表 3. 翻转列表 4. 水平导航 1. 内边距与外边距 Ul { Margin: 0; Padding: 0; } 2. 使用图片作为列表图标 Ul { Margin: 0; Padding:0; Width: 200px; List-style-image:url(i 阅读全文
posted @ 2019-03-31 08:56 柳志军 阅读(173) 评论(0) 推荐(0) 编辑
22 , CSS 构造颜色、背景与图像
摘要：1. 设定颜色 2. 背景使用 3. 图像使用 1.设定颜色 红色的几种合法定义; #f00; #ff0000; Red; Rgb(255,0,0); Rgb(100%,0%,0%); 2.十六进制三元组 第一个字节:红色的值; 第二个字节:绿色的值; 第三个字节:蓝色的值; 简化写法:#ccccc 阅读全文
posted @ 2019-03-31 08:48 柳志军 阅读(235) 评论(0) 推荐(0) 编辑
21 , CSS 构造模型
摘要：1. div 2. 边距 3. 边框 4. 定位 5. 浮动 1 21.1 div 部分(division) <div>元素,经常以 div 形式引用 是 XHTML 元素,用于定义 XHTML 文 件中的区域. 1.添加 div <div> <p>This is our content area. 阅读全文
posted @ 2019-03-31 08:41 柳志军 阅读(306) 评论(0) 推荐(0) 编辑
20, CSS 定义选择器
摘要：1. ID 与类 2. 层叠 3. 分组 4. 继承 5. 上下文选择器 6. 子类选择器 7. 其他选择器 8. 结构与注释 20.1 ID 与类 选择器是用于控制页面设计的样式.即 ID 选择器何类选择器. 一直以来,许多开发人员经常将 ID 与类混淆,或者不能正确的使用这两种选择器,或者简 单 阅读全文
posted @ 2019-03-31 08:32 柳志军 阅读(233) 评论(0) 推荐(0) 编辑
19,CSS 滤镜
摘要：1.Filter 属性介绍 2.Alpha 滤镜的使用 3.Blur 滤镜的使用 4.Filph、Filpv 滤镜 5.DropShadow 滤镜 6.Glow 滤镜 7.Gray ,Invert,Xray 滤镜 8.Shadow 滤镜 1 19.1 F Fr ilter 属性介绍 设置或检索对象所 阅读全文
posted @ 2019-03-31 08:21 柳志军 阅读(257) 评论(0) 推荐(0) 编辑
18 章 CSS 链接、光标、 DHTML 、缩放
摘要：1.CSS 中链接的使用 2.CSS 中光标的使用 3.CSS 中 DHTML 的使用 4.CSS 中缩放的使用 1 18 8. .1 1 S CSS 中 链接的使用 超链接伪类属性 a:link 表示该超链接文字尚未被点选 a:visited 表示该超链接文字已被点选过 a:active 表示该超 阅读全文
posted @ 2019-03-30 17:56 柳志军 阅读(317) 评论(0) 推荐(0) 编辑
17 ， CSS 区块、浮动、定位、溢出、滚动条
摘要：1.CSS 中区块的使用 2.CSS 中浮动的使用 3.CSS 中定位的使用 4.CSS 中溢出的使用 5.CSS 中滚动条的使用 17.1 CSS 中区块的使用 属性名称 属性值 说明 width 像素/百分比 区块的宽度 auto height 像素/百分比 区块的高度 auto min-hei 阅读全文
posted @ 2019-03-30 17:46 柳志军 阅读(480) 评论(0) 推荐(0) 编辑
16 ， CSS 边框与边界
摘要：1.CSS 中边框的使用 2.CSS 中边界的使用 16.1 CSS 中边框的使用 属性名称 属性值 说明 border-color 十六进制 可依序设置上，右，下，左线颜色 英文名称 border-color:red(四边均为红色) 三原色 border-color:red green (上下为红 阅读全文
posted @ 2019-03-30 17:35 柳志军 阅读(626) 评论(0) 推荐(0) 编辑
15 ， CSS 背景与列表
摘要：1.CSS 中背景的使用 2.CSS 中列表的使用 15.1 CSS 中背景的使用 属性名称 属性值 说明 background-attachment scroll 设置背景图像会随视窗滚动 条的移动而移动。 fixed 设置背景图像不会随视窗滚动条 的移动而移动。 background-color 阅读全文
posted @ 2019-03-30 17:30 柳志军 阅读(141) 评论(0) 推荐(0) 编辑
14 ,CSS 文字与文本
摘要：1.CSS 中长度与颜色 2.CSS 中的文字属性 3.CSS 中的文本属性 14.1 CSS 中长度与颜色 长度单位 说明 in 英寸 cm 公分 mm 公里 cm 以目前字体高度为单位 ex 以小写字母高度为单位（大部分不支持） pt 1pt/72英寸 pc 1pc/12pt px 像素（推荐使 阅读全文
posted @ 2019-03-30 17:15 柳志军 阅读(288) 评论(0) 推荐(0) 编辑
13 ，CSS 入门基础,行内排版内嵌式排版和外部排版样式
摘要：1.认识 CSS 2.传统 HTML 设计网页版面的缺点 3.CSS 的特点 4.CSS 的排版样式 13.1 认识CSS CSS的英文全名是 Cascading Style Sheets,中文可翻译为串接式排版样式,并且 CSS2规范 也于 1998 年 02 月通过 W3C 的审核与推荐,所以 阅读全文
posted @ 2019-03-30 16:29 柳志军 阅读(828) 评论(0) 推荐(0) 编辑




点击右上角即可分享
微信分享提示