css颜色 | 易学教程

[转]CSS clear both清除浮动

阅读更多关于 [转]CSS clear both清除浮动

本文转载于: 猿2048 网站 [转]CSS clear both清除浮动 DIV+CSS clear both清除产生浮动我们知道有时使用了 css float 浮动会产生 css浮动，这个时候就需要清理清除浮动，我们就用 clear 样式属性即可实现。接下来我们来认识与学习 css clear 知识与用法。 clear清除浮动目录 clear语法与结构 div clear常用地方 css+div案例 DIVCSS5总结一、clear语法与结构 - TOP 1、clear语法： clear : none | left|right| both 2、clear参数值说明： none : 　允许两边都可以有浮动对象 both : 　不允许有浮动对象 left : 　不允许左边有浮动对象 right : 　不允许右边有浮动对象 3、clear解释：该属性的值指出了不允许有浮动对象的边情况，又对象左边不允许有浮动、右边不允许有浮动、不允许有浮动对象。 4、css结构 div {clear:left} div{clear:right} div{clear:both} 二、div clear常用地方 - TOP 我们常常用于使用了float css样式后产生浮动，最常用是使用clear:both清除浮动。比如一个大对象内有2个小对象使用了css float样式为了避免产生浮动

前端CSS

阅读更多关于前端CSS

前端CSS CSS介绍 CSS（ C ascading S tyle S heet，层叠样式表)定义如何显示 HTML元素。当浏览器读到一个样式表，它就会按照这个样式表来对文档进行格式化（渲染）。 CSS语法 CSS实例每个CSS样式由两个组成部分：选择器和声明。声明又包括属性和属性值。每个声明之后用分号结束。 CSS注释 /*这是注释*/ 注释是代码之母。 CSS的几种引入方式行内样式行内式是在标记的style属性中设定CSS样式。不推荐大规模使用。 <p style="color: red">Hello world.</p> 内部样式嵌入式是将CSS样式集中写在网页的<head></head>标签对的<style></style>标签对中。格式如下：按 Ctrl+C 复制代码按 Ctrl+C 复制代码外部样式外部样式就是将css写在一个单独的文件中，然后在页面进行引入即可。推荐使用此方式。 <link href="mystyle.css" rel="stylesheet" type="text/css"/> CSS选择器基本选择器元素选择器 p {color: "red";} ID选择器 #i1 { background-color: red; } 类选择器按 Ctrl+C 复制代码按 Ctrl+C 复制代码注意：样式类名不要用数字开头

day45-前端CSS

阅读更多关于 day45-前端CSS

1 . 0 CSS介绍 CSS（ C ascading S tyle S heet，层叠样式表)定义如何显示 HTML元素。当浏览器读到一个样式表，它就会按照这个样式表来对文档进行格式化（渲染）。 2.0 CSS语法 2.1 CSS实例每个CSS样式由两个组成部分：选择器和声明。声明又包括属性和属性值。每个声明之后用分号结束。 2 . 2 CSS注释 /*这是注释*/ 注释是代码之母。 3.0 CSS的几种引入方式 3 . 1 行内样式行内式是在标记的style属性中设定CSS样式。不推荐大规模使用。 <p style="color: red">Hello world.</p> 3. 2 内部样式嵌入式是将CSS样式集中写在网页的<head></head>标签对的<style></style>标签对中。格式如下： <head> <meta charset="UTF-8"> <title>Title</title> <style> p{ background-color: #2b99ff; } </style> </head> 3. 3 外部样式外部样式就是将css写在一个单独的文件中，然后在页面进行引入即可。推荐使用此方式。 <link href="mystyle.css" rel="stylesheet" type="text/css"/> 4 . 0 CSS选择器

css绘制三角形

阅读更多关于 css绘制三角形

　　简单写一个空的div，设置款高为0，设置边框border 　　实现这个效果　　 div{ width: 0; height: 0; /* 设置边框 */ border: 100px solid; /* 边框颜色 */ border-color: #f00 #000 #0f0 #00f } 　　只要将其他边框设为透明色，单独设置一个边框的颜色，就实现了一个三角形 div { width: 0; height: 0; /* 设置边框 transparent为透明 */ border: 100px solid transparent; /* 要设置的位置 */ border-bottom: 100px solid #f00; } 来源： https://www.cnblogs.com/zhangcheng001/p/11458801.html

前端基础之CSS

阅读更多关于前端基础之CSS

一、CSS介绍 CSS（ C ascading S tyle S heet，层叠样式表)定义如何显示 HTML元素。当浏览器读到一个样式表，它就会按照这个样式表来对文档进行格式化（渲染）。二、CSS语法 1、CSS实例每个CSS样式由两个组成部分：选择器和声明。声明又包括属性和属性值。每个声明之后用分号结束。 2、CSS注释 /*这是注释*/ 三、CSS的几种引入方式 1、行内样式行内式是在标记的style属性中设定CSS样式。不推荐大规模使用。 <p style="color: red">Hello world</p> 2、内部样式嵌入式是将CSS样式集中写在网页的<head></head>标签对的<style></style>标签对中。格式如下： <head> <meta charset="UTF-8"> <title>Title</title> <style> p { /*字体颜色*/ color: red; /*背景颜色*/ background-color: blue;　　　　　　　 /* 字体大小（像素大小）*/ font-size: 14px; /* 外边距大小 */ margin: 14px; 　　　　　　　　　　　　　　　/* 边框颜色 */ border: 2px solid red; } </style> </head> 3、外部样式

前端入门CSS(1)

阅读更多关于前端入门CSS(1)

day48 参考： https://www.cnblogs.com/liwenzhou/p/7999532.html CSS的几种引入方式行内样式行内式是在标记的style属性中设定CSS样式，不推荐大规模使用，作用范围小，优先级最高。 <p style="color: red">Hello world.</p> 内部样式嵌入式是将CSS样式集中写在网页的 <head></head> 标签对的<style></style>标签对中。格式如下： <head> <meta charset="UTF-8"> <title>Title</title> <style> p{ background-color: #2b99ff; } </style> </head> 整个h3的颜色都被更改。外部样式外部样式就是将css写在一个单独的文件中，然后在页面进行引入即可。推荐使用此方式。 <link href="mystyle.css" rel="stylesheet"> CSS选择器基本选择器 1.元素选择器 2.ID选择器 3.类选择器 p(元素) #p2(ID) 尽量不要使用需要保证id的属性值具有唯一性 JavaScript: 对象document,方法getElementById("one")，标签变成了对象，只要找到就不找了。 .c1(类) 标签中的class属性如果有多个

web css

阅读更多关于 web css

CSS圆角——透明圆角化背景图片序言：第一章中我介绍了最基本的纯CSS圆角框的实现原理，并给出Demo，在本章中会对上一个模型作一些新的创新，实现将背景图片透明圆角化。并给出一些漂亮的通用演示效果。在上面的案例中，我只给出最为原始的圆角框模型，它还是存在一些不足之处。比如不能将图片应用到圆角框内。而在本例中，我会在上面的基础上作出一些创新。就是将背景图片也圆角化，好像目前在网络上还没有这样的功能应用，我只见过用js方式来实现的，可以参看我的《超圆滑圆角框的半完美解决方案》一文中后面几种JS方案。但是纯CSS方式的实现可是我独家所创，如有雷同，只能说英雄所见略同。呵呵！还是先看看最终的效果图，让大家有一个大概的印象。图一像这种小面积布局在网页设计中应用得很普遍，但目前网络流行的作法都是采用图片的方式来实现的，将图片按上中下切成三块内容，然后使用三个同级的DIV或SPAN容器各自填充一张图，但是这种方法有一个最大的毛病：不能自动适应宽度的变化，一般做法都是采用固定宽度的方式，这是由于图片的宽度决定的。当然对于一些比较有经验的人员来说，可以采用九宫格布局（可参看我的另一篇文章《九宫格基本布局》）方式或者滑动门方式来做到自适应宽度的变化，九宫格一般都需要用到八张图片，而滑动门虽然只用一张图片，但为了适应宽度的变化，这张图片一般都做得很大。

深入学习jQuery样式操作

阅读更多关于深入学习jQuery样式操作

博客园首页新随笔联系订阅管理随笔 - 273 文章 - 0 评论 - 410 深入学习jQuery样式操作 × 目录 [1]设置样式 [2]增加样式 [3]删除样式 [4]切换样式 [5]判断样式 [6]样式操作前面的话　　使用javascript脚本化CSS是一个系列，包括行间样式、计算样式、 CSS类、样式表、动态样式和伪元素这六部分。而jQuery也实现了脚本化CSS的功能，提供了更为简单易用的方法设置样式　　前面介绍过jQuery的特性操作，可以通过 attr()方法进行样式设置 <style> .cB{color: blue;} </style> <script src="http://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script> <div id="test">测试文字</div> <button id="btn1">按钮</button> <script> btn1.onclick = function(){ $('#test').attr('class','cB') } </script> 　　[注意]jQuery对象无法直接使用className属性设置类名，需要转换为javascript对象才可以使用 <style> .cB{color: blue;} <

css学习归纳总结

阅读更多关于 css学习归纳总结

来源于:trigkit4 css学习归纳总结（一）选择器的分组 CSS选择器分为 1.群组选择器如：p, body, img, div{} 2.兄弟选择器如：p + p { color:#f00; } 3.属性选择器如： p[title] { color:#f00; } 4.包含（后代）选择器如：body ul li{} 5.子元素选择器如：div > p{} 6.ID选择器如：#myDiv{} 7.类选择器如：.class1{} 8.伪元素选择器如：E:first-line，E:before 9.伪类选择器如：E:first-child ，E:visited，E:focus，E:enabled 10.标签选择器如：p { font-size:1em; } 子选择器和后代选择器的区别：后代选择器的写法就是把外层的标记写在前面，内层的标记写在后面，之间用空格分隔。子选择器只对直接后代有影响的选择器，而对“孙子后代”以及多层后代不产生作用。注意：在IE6中，只支持后代选择器，不支持子选择器盒子模型 css框模型介绍：给 ul 下的 li 设置宽度，那么他们将平均掉它们所占容器的宽度。 div >ul> li> a 标签所占宽度和高度：当你为 body 元素指定 div 时，每个 div 默认的宽为浏览器的100%，高度在每个浏览器的解析都是不一样的

灵活运用CSS开发技巧(66个实用技巧，值得收藏)

阅读更多关于灵活运用CSS开发技巧(66个实用技巧，值得收藏)

前言灵活运用CSS开发技巧请戳这里，持续更新灵活运用JS开发技巧请戳这里，持续更新何为技巧，意指表现在文学、工艺、体育等方面的巧妙技能。代码作为一门现代高级工艺，推动着人类科学技术的发展，同时犹如文字一样承托着人类文化的进步。每写好一篇文章，都会使用大量的写作技巧。烘托、渲染、悬念、铺垫、照应、伏笔、联想、想象、抑扬结合、点面结合、动静结合、叙议结合、情景交融、首尾呼应、衬托对比、白描细描、比喻象征、借古讽今、卒章显志、承上启下、开门见山、动静相衬、虚实相生、实写虚写、托物寓意、咏物抒情等，这些应该都是我们从小到大写文章而接触到的写作技巧。作为程序猿的我们，写代码同样也需要大量的写作技巧。一份良好的代码能让人耳目一新，让人容易理解，让人舒服自然，同时也让自己成就感满满(哈哈，这个才是重点)。因此，我整理下三年来自己使用到的一些 CSS开发技巧，希望能让你写出耳目一新、容易理解、舒服自然的代码。目录既然写文章有这么多的写作技巧，那么我也需要对 CSS开发技巧整理一下，起个易记的名字。 Layout Skill ：布局技巧 Behavior Skill ：行为技巧 Color Skill ：色彩技巧 Figure Skill ：图形技巧 Component Skill ：组件技巧备注代码只作演示用途，不会详细说明语法部分技巧示例代码过长，使用

订阅 css颜色