- 博客(38)
- 收藏
- 关注
RSS订阅原创 CSS_多列
columncolumn-count:3;分为三列column-gap：50px;列与列之间的距离column-rule-color:lightblue;分割线颜色column-rule-style:dotted;分割线样式column-rule-width:1px;分割线宽度column-width：200px；每列的宽度column-span:
2018-01-31 10:23:18
140
原创 CSS3_过渡
transition-property：width；property规定了过渡的元素，这里是宽度。transition-duration：2s;duration规定了过渡的时间，默认是0；transition-delay：2s；delay规定了指针悬浮多久触发过渡。transition-timing-function: linear|ease|ease-in|ease-out|
2018-01-31 10:08:23
168
原创 CSS_2D/3D转换
transform:translate(50px,100px);左侧为X轴，顶部为y轴，根据给定的参数移动transform: rotate(30deg);旋转，正数为顺时针负数为逆时针transform: scale(2,3);缩放，第一个值为宽度的倍数，第二个值为高度的倍数transform: skew(30deg,20deg);第一个值为水平的倾斜角度，正值向左，负值向右
2018-01-31 08:57:17
221
原创 CSS_z文本新特性
文本阴影text-shadow: h-shadow v-shadow blur color;盒子阴影box-shadow: h-shadow v-shadow blur color;单词换行（只有单个单词长度超过行的长度才生效）word-wrap: normal|break-word;word-break: normal|break-all|keep-all;第二行如果是norma
2018-01-31 08:44:12
118
原创 CSS_渐变
线性渐变 background: repeating-linear-gradient();最简单的只加两个颜色，比如green，yellow，会出现上方绿色渐变为黄色，在颜色后面加空格加百分比可以控制整体比例。如果加to right，green，yellow会出现左侧绿色渐变为黄色，参数有to bottom、to top、to right、to left、to bottom right
2018-01-29 15:16:03
109
原创 CSS_background
background-size; length|percentage|cover|contain;length,宽度、高度，如果只给出一个值，第二个值为auto；percentage，宽度、高度，如果只给出一个值，第二个值为auto；cover，保持图片的纵横比，将图片设置为能覆盖背景区域的最小尺寸；contain，保持图片的纵横比，将图片设置为能覆盖背景区域的最大尺寸。bac
2018-01-29 14:13:36
78
原创 CSS_边框补充
practice div { border:15px solid transparent; width:250px; padding:10px 20px; } #round{ border-image:url(border.png) 30 30 round;}#stretch{ border-image:url(border.png) 10 10 round
2018-01-29 13:59:30
123
原创 CSS3_边框
border-dadius:(1-4)/(1-4);用于实现边框的圆角，斜杠前面的值代表水平方线，后面的四个值代表竖直方向。按照位置，可以分为左上，右上，右下，左下四个位置。如果有四个值，则一一对应。如果三个值，左上，右上和左下，右下。如果两个值，左上右下，右上左下。box-shadow: h-shadow v-shadow blur spread color inset;
2018-01-29 09:59:59
543
1
原创 CSS_旋转
practice div { background:red; width:160px; height:80px; } #div2 { transform:rotate(30deg); } 你好这是一个div元素。 你好这是一个div元素
2018-01-29 08:38:31
111
原创 CSS_属性选择器
【name】{}以上是普通的属性选择器属性和值选择器【name=value】{}区别在于指定的一个值。然后是~和|[title~=hello]{ color:blue;} 将适用:Hello worldHello CSS students!将不适用:Hi CSS students![lang|=en]{ color:blue;}将适用
2018-01-28 23:05:31
200
原创 CSS_媒体类型
为了更好地体验，一个网页在屏幕上和打印纸上用的字体、间距可能不同，所以通过媒体类型设置。用法@media type{}type常用类型有all、print、screen、handheld（是手机吗？）
2018-01-28 22:33:21
676
原创 CSS_图片拼合
这一节出了个小错误，耽误了巨久，巨久。先总结套路然后css.img pic{ height:46px; width:46px; background:url(address)}在HTML中，图片的地址处应该加一个透明图。然后CSS里面加需要切割的图片。犯的错误是我自己默认他们两个都是一个图，哎。
2018-01-28 22:28:17
264
原创 CSS_图片廊&透明度
practice div.img { margin:5px; border:1px solid #ccc; float:left; width:180px; } div.img:hover { border:1px solid #777; } div.img img { width:100%; height:100px
2018-01-27 16:26:41
212
原创 CSS_下拉菜单&提示工具
大概分三个部分。常驻内容（词贫）就是一直显示的那种。用div包裹起来（这里的div需要包裹第二个部分，也就是下拉内容）position:relatove;display:inline-block;下拉内容同样用一个div标签包裹到上一个div中。position:absolute;display:hidden;激活指针指上去会触发下拉菜单，通过选择器
2018-01-27 15:27:03
319
原创 CSS_选择器
后代选择器就不说了子代选择器div>p被div直接包裹的p标签都会被选中，如果是div包裹span再包裹p则不会被选中。然后就是相邻兄弟选择器了div+p这里有一点 要注意hihihi这段代码中使用div+p只会选中选中第一个P标签但是hellohellohellohello使用div+div会选中出第一行之外的所有，因为+
2018-01-25 22:26:05
126
原创 CSS_display_visibility
display，默认是展示的，如果给值none则为隐藏。display:none;visibility也是如此，给值hidden则为隐藏。但二者有区别。 practice .hidden{visibility:hidden;} .hidden2{display:none;} 这是一个通过visibility展示的可见标题 这是一个通过vid
2018-01-23 20:31:43
138
原创 CSS_尺寸
怎么说呢，觉得这里面之前没有触及的是行高line-height:;百分之百的行高是紧密相邻的，所以大多数浏览器用是是110%或者120%然后是最大最小高度和宽度。新手上路，欢迎斧正。
2018-01-23 17:20:58
109
原创 CSS_选择器
首先说id选择器#name{}然后是class.name{}不过class名字后面可以继续精确的某个标签元素.name p还有就是直接对多个标签设置h1,h2,p逗号隔开
2018-01-23 17:07:44
181
原创 CSS_padding
和margin的区别在于padding可以有背景色而后者不可以,不过padding的颜色不是它自己的，而是来自他包裹的元素的。同样有padding-left:20px;
2018-01-23 17:01:50
383
原创 CSS_轮廓
简单三个属性style、color和width。主要即一下style的几个值outline-style:nonedotted（点虚线）dashed（虚线）solid（实线）doublegroove（凹槽）ridge（垄状）inset（嵌入）outset（外凸）
2018-01-23 16:56:25
133
原创 CSS_边框
主要是style、width和colorborder-left-style:dotted;border-width:;border-left-color:;
2018-01-23 16:38:45
116
原创 CSS_表格
放一个模仿的代码吧，不知道说什么。新的标签就是对标题位置的改变caption{ caption-side:bottom;} practice caption { caption-side:bottom; } th { background-color:green; color:white; } .type1
2018-01-23 15:10:51
108
原创 CSS_列表
就是在HTML基础上更加个性化，回顾下带代码。list-style-image:url('');list-style-type:circle;
2018-01-23 15:08:32
95
原创 CSS_链接
a.class:link{;}a.class:visited{;}a.class:hover:{;}a.class:active{;}讲的是对链接四个状态的设置。有颜色，下划线，字体大小，背景色，字体。新手上路，欢迎斧正。
2018-01-22 21:01:21
126
原创 CSS_字体
字体字体当然是先说字体了font-family:"times new roman",times,serif;注意的地方就是如果字体的名字超过一个字就需要加引号。然后是大小font-szie:20px;还有就是W3C建议的em，换算单位是em=px/16，数学烂的人表示很无奈。再然后就就是斜体font-style:参数有normal和italic。字体
2018-01-22 20:34:40
110
原创 CSS_文本、背景
从背景说起， 首先想到的是桌面（我也很无奈）那就从背景图说起吧。background-image：url（'相对路径'）;说道背景图不能避开重复这个问题，好像是叫平铺，记得小时候自己该桌面背景经常变成N个图片同时排列到一起。for example解决的办法是通过background-image:no-repeat;或者希望它在横向或者纵向重复background
2018-01-22 20:07:48
165
原创 HTML_颜色
颜色，red green blue这个没什么好说的大一头脑一热看过一本PScc教程（的前几页）比较有意思的是透明色（毕竟android顶部状态栏都开始沉浸了）。印象中大一老师教的如下background:#FFFFFFopacity:0.8教材是这样子的度娘说之前老师教的那个只能对背景色起作用，下面这个只支持IE9以上。大概就是这些吧。
2018-01-21 20:55:05
200
原创 HTML_框架
看到框架想到的单词当然是frame，但是没明白标签iframe中的i是什么缩写这个章节相当简单，简单说就是在自己写的网页里面有个窗口来展示别的网页，有点国中国的意思。 还有一个有意思的地方就是通过点击来实现窗口展示网页的切换，类似于电视换频道。跳转通俗说就是先给iframe一个网址作为默认显示的网页，然后给iframe起一个名字,然后标签包裹文本链接 同时指定目标（targe
2018-01-21 20:40:37
162
原创 HTML_表单
表单即1.文字输入框 2.密码输入框框 3.单选按钮 显示给用户的值4.多选按钮（预选按钮）显示给用户的值5.下拉框（预选下拉框）select 同时注意标签option需要/6.按钮（分为提交按钮和普通按钮）7.文本框，顾名思义，textarea,通过width和height规定长度与宽度。8.带边框的输入框。通过fieldset和lengend定义，其中len
2018-01-21 20:20:19
171
原创 HTML_布局
（01）用div布局 practice 主要的网页标签 菜单 HTML CSS JavaScript 内容在这里 版权awt20141110@gmail.com （2）用表格布局 practice
2018-01-21 15:24:16
252
原创 HTML _div span
practice 这是一些文本 这是一个包裹在div中的标题 这是一个包裹在div中的文本 这是一个包裹在div中的标题 这是一个包裹在div中的文本 这是一个包裹在div中的标题 这是一个包裹在div中的文本 这是一个文本本章节主要是介绍了div 和span标签，因为之前有老师略微介绍过HTML的内容，所以我理解为方便通过CS
2018-01-21 10:05:08
159
原创 HTML_列表
practice 默认无序列表 星期一 星期二 星期三 圆圈无序列表 星期一 星期二 星期三 正方形无序列表 星期一 星期二 星期三 默认有序列表 星期一 星期二 星期三 大写字母有序列表 星期一 星期二 星期三
2018-01-21 09:47:46
195
原创 HTML_表格
表格标题 其中会存在跨行、跨列的情况存在。跨行时，即一个表格可能对应着多列表格，此时使用colspan、rowspan。我们以跨两行为例，以上代码第三行应修改为以跨两列为例，以上代码第四行代码应修改为 关于边框，由border定义，不写和border="0
2018-01-20 21:06:28
365
原创 HTML_图像
其中，border就是图片的边框，如果边框尺寸大于图片的尺寸会自动填充颜色。src后面跟图片的地址，本地图片需要跟图片的路径名字以及拓展名。如果是网络图片直接写图片的链接即可。alt我的理解是当图片无法正常显示时会用alt后面的文字来代替图片，图片的浮动就不仔细说了。无非是用链接标签包裹图片标签 觉得比较有意思的是图片的映射，即在一般图片的格式后面添加了usem
2018-01-20 15:17:39
317
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人