简单CSS3下拉菜单效果实现 登录

下一节课程: 无 (次播放)

5 秒后自动播放下一节
  重新观看
介绍 >

Web开发基础_HTML+CSS

难度:初级 共17节 30959次学习

新课:PHP零基础(CMS开发)教学!

立即报名
章节 评论 笔记 课件
第1章 web前端基础

web前端基础(学习html和css我们可以做什么)

11分钟45秒

html基础

第2章 HTML中常用标签及属性

HTML中的常用标签及属性(文档头部 head)

HTML中的常用标签及属性(文本 字体格式化)

HTML中的常用标签及属性(超链接)

HTML中的常用标签及属性(列表)

HTML中的常用标签及属性(form表单)

HTML中的常用标签及属性(表格)

第3章 CSS基础及样式控制

css基础

CSS中的盒模型

CSS中的边框样式

CSS中的背景控制

块级元素和行内元素相互转换

CSS中的定位

CSS中的浮动

第4章 HTML+CSS常用布局案例

常用导航布局案例

简单CSS3下拉菜单效果实现

全部评论我要评论

暂无评论~

全部笔记发布笔记

  • Risco

    Risco5年前

    *{padding: 0px;margin: 0px;} a{text-decoration: none;/* 去掉下划线 */ line-height: 38px;/* 行高 */font-size:15px;/* 字体大小 */} ul li{list-style:none;/* 去掉有序列表前面的圆点 */} .clear{clear:both} .top{width: 100%;/* 宽 */height: 38px;/* 高 */background-color: #f5f5f5;/* 背景颜色 */} .top_center{width: 1200px;/* 宽 */height: 38px;/* 高 */margin: 0px auto;/* 居中 */} .top_left{/* 宽 */height: 38px;/* 高 */float: left/* 左浮动 */} .top_left a{margin-right: 5px;/* 右边外边距 */} .top_right{/* 宽 */height: 38px;/* 高 */float: right;/* 有浮动 */} .top_right a{margin-right: 6px;/* 右边外边距 */} .top_left_a{color: #6c6c6c;/* 字体颜色 */display:inline-block;/* 内快元素 例如显示下拉框 */ position: relative;/* 相对定位 例如相对框内的定位*/height: 38px;/* 高 */text-align: center;/* 文字居中 */} .top_left_b{color: #6c6c6c;/* 字体颜色 */} .top_left_a:hover{height:38px;/* 鼠标点击的高度 */background-color: #fff;/* 鼠标点击的背景颜色 */color: red;/* 字体颜色 */}/* 鼠标点击的效果 */ .top_left_b:hover{color: red;/* 字体颜色 */}/* 鼠标点击的效果 */ .top_left_a ul{border: 1px solid #f5f5f5;/* 边框为 一个像素 边框为单线*/display: none;/* 次元素不会被显示 例如元素不显示在行外 只是合并了 */} .top_left_a:hover ul {display: block;/* 鼠标点击后显示快及元素 例如显示在下方*/position: absolute;/* 绝对定位 */width: 90px;/* 鼠标点击的高 */} /* 鼠标点击的效果 */ .top_left_a ul li{color: #6c6c6c;/* 字体颜色 */} .top_left_a ul li:hover{background-color: #f5f5f5;/* 鼠标点击背景颜色*/}

    0

  • 取消 回复 发送
  • 取消 发布笔记 发送
  • PHP中文网