随笔分类 - [12]CSS

css案例学习之span边框实现的特殊效果

摘要：bottom leftbottom righttop lefttop right配合颜色来使用，实现一些神奇的效果#menu a span{ height:0; width:0; /*border-top:solid 6px #fff; ... 阅读全文

posted @ 2015-11-30 16:33 TBHacker 阅读(13769) 评论(0) 推荐(0) 编辑

css案例学习之通过relative与absolute实现带说明信息的菜单

摘要：效果如下代码带说明信息的菜单 Home 这里说明Home菜单项 Contac... 阅读全文

posted @ 2015-11-30 16:15 TBHacker 阅读(332) 评论(0) 推荐(0) 编辑

css案例学习之div a实现立体菜单

摘要：效果代码立体菜单 Home Contact Us Web Dev Web Design Map 阅读全文

posted @ 2015-11-30 15:58 TBHacker 阅读(852) 评论(0) 推荐(0) 编辑

css案例学习之双斜角横线菜单

摘要：效果代码双斜角横线菜单 Home Contact Us Web Dev Web Design Map 阅读全文

posted @ 2015-11-30 15:54 TBHacker 阅读(1111) 评论(0) 推荐(0) 编辑

css案例学习之div+a实现菜单

摘要：效果代码基本菜单 Home Contact Us Web Dev Web Design Map 阅读全文

posted @ 2015-11-30 15:50 TBHacker 阅读(379) 评论(0) 推荐(0) 编辑

css案例学习之div ul li a 实现导航效果

摘要：效果代码无需表格的菜单 Home Contact us Web Dev Web Design Map改造一下li加一个float属性无需表格的菜单 Home Contact us Web Dev Web Design Map效果阅读全文

posted @ 2015-11-30 15:22 TBHacker 阅读(742) 评论(0) 推荐(0) 编辑

css案例学习之按钮超链接

摘要：效果css实现按钮超链接 Home Contact Us Web Dev Web Design Map 阅读全文

posted @ 2015-11-30 15:15 TBHacker 阅读(420) 评论(0) 推荐(0) 编辑

css案例学习之relative与absolute

摘要：代码 absolute属性 Box-1 Box-2 Box-3 说明relative是相对于浏览器定位的，absolute是相对于relative定位的。它们都要结合top、right、left、bottom属性来使用。代码 ... 阅读全文

posted @ 2015-11-26 17:31 TBHacker 阅读(250) 评论(0) 推荐(0) 编辑

css+div布局案例

摘要：给最外层的div命名一个class有针对性的进行css布局。填写表格姓名：手机： ... 阅读全文

posted @ 2015-11-26 11:24 TBHacker 阅读(583) 评论(0) 推荐(0) 编辑

纯CSS美化的checkbox 和 radio

摘要：html纯CSS3实现自定义美化复选框和单选框 Checkbox Small Checkbox Big ... 阅读全文

posted @ 2015-11-25 17:00 TBHacker 阅读(717) 评论(0) 推荐(0) 编辑

css案例学习之float浮动

摘要：代码： float属性 Box-1 Box-2 Box-3 这里是浮动框外围的文字，这里是浮动框外围的文字，这里是浮动框外围的文字，这里是浮动框外围的文字，这里是浮动框外围的文字，这里是浮动框外围的文字，这里是浮动框外围的文字，这... 阅读全文

posted @ 2015-11-23 10:57 TBHacker 阅读(527) 评论(1) 推荐(0) 编辑

css案例学习之父子块的margin

摘要：两边还会有些距离，这是body默认的。代码：父子块的margin 子div 两边没有了距离父子块的margin 子div 说明：子元素只能在父元素允许的空间中活动。默认情况下会自动填满父元素。撑破了代码：设置父块的高度子... 阅读全文

posted @ 2015-11-23 10:12 TBHacker 阅读(287) 评论(0) 推荐(0) 编辑

block，inline和inline-block概念和区别

摘要：总体概念block和inline这两个概念是简略的说法，完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素)。block元素通常被现实为独立的一块，会单独换一行；inline元素则前后不会产生换行，一系列inline元素都在一行... 阅读全文

posted @ 2015-11-23 10:03 TBHacker 阅读(261) 评论(0) 推荐(0) 编辑

css案例学习之div与span的区别

摘要：代码：div 标记范例这是一个div标记1 这是一个div标记2 这是一个div标记3 这是一个span标记1 这是一个span标记2 这是一个span标记3 ... 阅读全文

posted @ 2015-11-23 09:50 TBHacker 阅读(448) 评论(0) 推荐(0) 编辑

css案例学习之盒子模型

摘要：定义：每个盒子都有：边界、边框、填充、内容四个属性；每个属性都包括四个部分：上、右、下、左；这四部分可同时设置，也可分别设置；里的抗震辅料厚度，而边框有大小和颜色之分，我们又可以理解为生活中所见盒子的厚度以及这个盒子是用什么颜色材料做成的，边界就是该盒子与其它东西要保留多大距离。案例代码：盒子模型的... 阅读全文

posted @ 2015-11-23 09:27 TBHacker 阅读(1992) 评论(0) 推荐(0) 编辑

css案例学习之层叠样式

摘要：代码层叠特性这是第1行文本这是第2行文本这是第3行文本这是第4行文本这是第5行文本说明：第五行中，class中的red purple顺序不是关键。style中的red purple顺序才是关键。purple排在下面，所以最终颜色为紫色。先执行p b... 阅读全文

posted @ 2015-11-23 09:11 TBHacker 阅读(272) 评论(0) 推荐(0) 编辑

css案例学习之继承关系

摘要：代码继承关系前沿教室欢迎来到前沿教室，这里为您提供丰富学习内容。在这里，你可以学习到： HTML CSS ... 阅读全文

posted @ 2015-11-23 08:55 TBHacker 阅读(352) 评论(0) 推荐(0) 编辑

css案例学习之全局声明*{} 与body{}的区别

摘要：代码全局声明全局声明h1 全局声明h2 全局声明h3 全局声明h4 全局声明h5 全局声明p1 全局声明p2 全局声明p3说明：全局声明之后，h1、h2、h3的大小都变成了15px代码全局声明全局声明h1 全局声明h2 全局声明h... 阅读全文

posted @ 2015-11-21 17:49 TBHacker 阅读(1103) 评论(0) 推荐(0) 编辑

css案例学习之并集选择器

摘要：代码并集选择器示例文字h1 示例文字h2 示例文字h3 示例文字h4 示例文字h5 示例文字p1 示例文字p2 示例文字p3混合使用，集体声明。阅读全文

posted @ 2015-11-21 17:17 TBHacker 阅读(1118) 评论(0) 推荐(0) 编辑

css案例学习之class执行的顺序

摘要：选择器.class 普通段落文本普通标题文本指定了.special类别的段落文本指定了.special类别的标题文本先执行统一的.special再执行特定p下面的.special最终p元素下的颜色还是变成了红色那些普通的special类元素没有变，依然是绿色阅读全文

posted @ 2015-11-21 17:10 TBHacker 阅读(527) 评论(0) 推荐(0) 编辑