CSS学习之路
bymyself11
这个作者很懒,什么都没留下…
展开
-
1.CSS基础—介绍及语法
CSS介绍css概括: css指层叠样式表 css样式表提高了工作效率CSS语法 属性选择器{ 属性:属性值}如:p{ color:red; }如果属性大于一,属性之间用分号隔开:p{color:red;font-size:20px}如果属性值大于一个单词,则属性值要加上引号:p{font-family:"sans s原创 2016-03-23 17:42:52 · 285 阅读 · 0 评论 -
CSS3嵌入字体@font-face
@font-face能够加载服务器端的字体文件,让浏览器端可以显示用户电脑里没有安装的字体。语法:@font-face { font-family : 字体名称; src : 字体文件在服务器上的相对或绝对路径;}这样设置之后,就可以像使用普通字体一样在(font-*)中设置字体样式。比如:p { font-size :12px; font原创 2016-07-19 16:46:47 · 502 阅读 · 0 评论 -
CSS3渐变色彩
CSS3 Gradient 分为线性渐变(linear)和径向渐变(radial)1.线性渐变语法:参数:第一个参数:指定渐变方向,可以用“角度”的关键词或“英文”来表示:第一个参数省略时,默认为“180deg”,等同于“to bottom”。第二个和第三个参数,表示颜色的起始点和结束点,可以有多个颜色值。实例代码如下:!DOCTYPE html>原创 2016-07-19 16:29:34 · 500 阅读 · 0 评论 -
css3边框——圆角效果(border-radius)、阴影(box-shadow)、边框应用图片(border-image)
1.圆角效果(border-radius)原创 2016-07-19 15:49:36 · 16295 阅读 · 0 评论 -
CSS Display(显示)和visibility(可见性)
1.display属性设置一个元素如何显示,visibility指定一个元素可见还是隐藏隐藏元素-display:none或visibility:hiddenvisibility:hidden可以隐藏某个元素,但隐藏的元素仍需占用与未隐藏之前一样的空间。也就是说,该元素虽然被隐藏了,但仍然会影响布局。display:none可以隐藏某个元素,且隐藏的元素不会占用任何空间。也就是说,该元原创 2016-07-23 15:36:14 · 409 阅读 · 0 评论 -
css分组合嵌套选择器
1.分组选择器在样式表中有很多具有相同样式的元素。如:h1{color:green;}h2{color:green;}p{color:green;}为了尽量减少代码,你可以使用分组选择器。每个选择器用逗号分隔.h1,h2,p{color:green;}2.嵌套选择器它可能适用于选择器内部的选择器的样式原创 2016-07-23 15:18:41 · 1506 阅读 · 0 评论 -
关于Margin(外边距)
margin清除周围的元素(外边框)的区域。margin没有背景颜色,是完全透明的margin可以单独改变元素的上,下,左,右边距。也可以一次改变所有的属性。可能的值auto 设置浏览器的边距。(这样使用结果会依赖浏览器)length 定义一个固定的margin(使用像素,pt,em等)% 定义一个使用百分比的边距在CSS中,它可以指定不同的原创 2016-07-23 15:00:53 · 752 阅读 · 0 评论 -
CSS关于 Border(边框)使用的主要的问题和知识点补充
1.border-style属性用来定义边框的样式border-style的值: none: 默认无边框dotted: dotted:定义一个点线框dashed: 定义一个虚线框solid: 定义实线边界double: 定义两个边界。 两个边界的宽度和border-width的值相同groove: 定义3D沟槽边界。效果取决于边界的颜色值ridge: 定义3D脊原创 2016-07-23 14:35:15 · 1653 阅读 · 0 评论 -
css样式表
1.外部样式表2.内部样式表3.内联样式4.多重样式表1.外部样式表.当样式需要应用于很多页面时,外部样式表将是理想的选择。每个页面使用标签链接到样式表 ,标签在文档的头部 如: 2.内部样式表.当单个文档需要特殊的样式时,就应该使用内部样式表。你可以使用 标签在文档头部定义内部样式表原创 2016-07-23 10:03:15 · 225 阅读 · 0 评论 -
7CSS动画-2D、3D转换,过滤,动画,多列以及用多列实现瀑布流
1.2D、3D转换通过CSS3转换,可以对元素进行移动、缩放、转动、拉长或拉伸。注:使用动画在要指明浏览器(1)2D转换方法 translate() 平移 rotate() 旋转 scale() 缩放 skew() 倾斜度 matrix() (2)3D转原创 2016-04-10 20:25:07 · 720 阅读 · 0 评论 -
6CSS常见操作 对齐、尺寸、分类、导航栏、图片
1.对齐使用margin属性进行水平对齐使用position属性进行左右对齐使用float属性进行左右对齐margin:0px auto;0px表示上下边距为0;左右自适应则会显示左右居中的效果2.尺寸属性 描述heightwidthl原创 2016-03-24 21:51:49 · 1031 阅读 · 0 评论 -
5.CSS定位、浮动
CSS定位属性 描述position 把元素放在一个静态,相对,绝对 ,或固定的位置中。top 元素向上偏移量left 元素向左偏移量right原创 2016-03-24 18:17:17 · 231 阅读 · 0 评论 -
4.CSS盒子模型
盒子模型的内容范围包括:margin、border、padding、content部分组成。1.内边框属性 描述padding原创 2016-03-24 14:56:40 · 392 阅读 · 0 评论 -
3.CSS基本样式:背景、文本、字体、链接、列表、表格、轮廓
1.背景: CSS允许应用纯色作为背景,也允许使用背景图像创建背景 属性 描述 background-attachment 背景图像是否固定或者随着页面的其余部分滚动 background-color 设置元素的背景颜原创 2016-03-23 22:26:26 · 733 阅读 · 0 评论 -
2.CSS基础-选择器
1.派生选择器 通过依据元素在其位置的上下文关系来定义样式代码如下:样式表里li strong{color:green;}html里代码helloworld运行结果:2.id选择器 id选择器可以为标有Id的HTML元素指定特定的样式 id选择原创 2016-03-23 19:16:25 · 289 阅读 · 0 评论 -
CSS3文本阴影text-shadow
text-shadow可以用来设置文本的阴影效果。语法:text-shadow: X-Offset Y-Offset blur color;X-Offset:表示阴影的水平偏移距离,其值为正值时阴影向右偏移,反之向左偏移; Y-Offset:是指阴影的垂直偏移距离,如果其值是正值时,阴影向下偏移,反之向上偏移;Blur:是指阴影的模糊程度,其值原创 2016-07-19 16:57:01 · 667 阅读 · 0 评论