网页设计的主要内容 第1篇
1 transition－property属性（属性值取值包括none、all和property） transition－property：none｜all｜property； 2 transition－duration属性 transition－duration：time； 3 transition－timing－function属性（常见属性：linear、ease、ease－in、ease－out、ease－in－out、cubic－bezier（n，n，n，n）） transition－timing－function：linear｜ease｜ease－in｜ease－out｜ease－in－out｜cubic－bezier（n，n，n，n）； 4 transition－delay属性（默认值0，常用单位秒s或毫秒ms，属性值可以为正整数、负整数和0） transition－delay：time； 5 transition属性 transition：property duration timing－function delay；
12D变形（4种变形效果：平移、缩放、倾斜、旋转） 平移 transform：translate（x－value，y－value）； 缩放 transform：scale（x－value，y－value）； 倾斜 transform：skew（x－value，y－value）； 旋转（单位deg，正数值顺时针旋转，负数值逆时针旋转） transform：rotate（angle）； 更改变换的中心点（transform－origin属性包含3个参数，默认值分别为50%、50%、0px） transform－origin：x－axis y－axis z－axis；
网页设计的主要内容 第2篇
网页设计固然重要，但是也要配合程序设计的工作，因为前台的界面功能很多都需要后台的程序技术来实现的。就好比我们前台设计就是设计菜的样式和菜的摆放，但是我们不是做菜的人，只是装饰菜的，后面的厨子负责使用材料去煮、炒、炖、炸，做出一道道美味的菜。而我们的配合则做出一个个各种功能的网页。
叶脉网络立足龙岩，发展地球村：工作室服务：龙岩网站建设 | 龙岩网站制作 | 龙岩做网站 | 龙岩seo | 龙岩网络营销解决方案策划
来自： dmpy > 《我的图书馆》
0条评论
发表
请遵守用户 评论公约
5个网页设计技巧让用户疯狂爱上你
5个网页设计技巧让用户疯狂爱上你。我们都希望成功的设计改版能让网站重新焕发活力，不仅仅吸引用户，并且让用户愿意花更长时间浏览。我...
时尚简洁的「网页风格」PPT设计模板
时尚简洁的「网页风格」PPT设计模板。第115期｜网页风格PPT.那我们能否从网页设计中吸取精华，提炼出对PPT有用的知识，或者说设计出具有...
z2009年度TOP30佳photoshop精品教程
网页设计的主要内容 第3篇
2 边框属性（border）
边框样式（border-style）：（none没有边框）（solid边框为单实线）（dashed边框为虚线）（dotted边框为点线）（double边框为双实线）
边框宽度（border-width）
设置边框颜色（border-color）：颜色的英文单词、十六进制颜色值或RGB模式rgb（r，g，b括号里是颜色色值或百分比）
内边距属性（padding）
外边距属性（margin）
*代表所有标签（通配符选择器）
让我的宽度包含边框和内边距和内容（box-sizing：border-box；）
3 背景颜色（background-color）（三种方式：直接写英文单词，rgb，十六进制颜色值） 4 背景图片（background-image）设置宽高 5 设置背景图像平铺（repeat沿水平和竖直两个方向平铺，no-repeat不平铺，repeat-x沿水平方向平铺，repeat-y沿竖直方向平铺） 6 设置背景图像位置（直接设置background-position：20px 20px，预定义关键字：水平方向值left center right，垂直方向值top center bottom，使用百分比） 7 设置背景图固定（background-attachment）俩属性（scroll图像随页面滚动，fixed图像固定在屏幕上不随页面滚动） 8 综合设置元素背景background：背景色 url（“图像”） 平铺 定位 固定
9 元素类型（块元素〈h1〉～〈h6〉、〈p〉、〈div〉、〈ul〉、〈ol〉、〈li〉） （行内元素〈strong〉、〈b〉、〈em〉、〈i〉、〈del〉、〈s〉、〈ins〉、〈u〉、〈a〉、〈span〉） 10 〈span〉标签 配合class属性使用 11 元素类型转换（display） inline行内元素 block块元素 inline-block行内块元素 none此元素将被隐藏不存在
12 颜色透明度 两种设置方法：rgba模式（r，g，b，alpha） opacity属性 opacity：参数 13 边框属性 14 阴影box-shadow属性共6个参数（h-shadow、v-shadow、blur、spread、color、outset/inset）
15 渐变（线性渐变和径向渐变） 线性渐变background-image：linear-gradient（渐变角度，颜色值1，颜色值2，...,颜色值n）
渐变角度：以deg为单位的角度数值或“to”加关键词
颜色值：颜色1为起始颜色，颜色n为结束颜色
径向渐变background-image：radial-gradient（渐变形状 圆心位置，颜色值1，颜色值2，...,颜色值n）
渐变形状：circle圆形径向渐变和ellipse椭圆形径向渐变 圆心位置：left和center和right和top和bottom 颜色值：颜色值1为起始颜色，颜色值n为结束颜色
重复渐变包括重复线性渐变和重复径向渐变 重复线性渐变background-image：repeating-linear-gradient（渐变角度，颜色值1，颜色值2，...，颜色值n） 重复径向渐变background-image：repeating-radial-gradient（渐变形状圆心位置，颜色值1，颜色值2，...，颜色值n）
1无序列表ul type属性值disc circle square 〈ul〉 〈li〉列表项1〈/li〉 〈li〉列表项2〈/li〉 〈li〉列表项3〈/li〉 ...... 〈/ul〉
2有序列表ol type属性（1，a或A，i或l）start（数字） value（数字） 〈ol〉 〈li〉列表项1〈/li〉 〈li〉列表项2〈/li〉 〈li〉列表项3〈/li〉 ...... 〈/ol〉
3定义列表dl（3个标签：dl，dt，dd） 〈dl〉 〈dt〉名词1〈/dt〉 〈dd〉是名词1的描述信息1〈/dd〉 〈dd〉是名词1的描述信息2〈/dd〉 ...... 〈dt〉名词2〈/dt〉 〈dd〉是名词2的描述信息1〈/dd〉 〈dd〉是名词2的描述信息2〈/dd〉 ...... 〈/dl〉
4定义列表实现图文混排
5列表嵌套的应用 〈ul〉 〈li〉列表项1〈/li〉 〈li〉列表项2〈/li〉 〈li〉 〈ol〉 〈li〉列表项1〈/li〉 〈li〉列表项2〈/li〉 〈/ol〉 〈/li〉 〈/ul〉
6 list-style-type属性（属性值disc,none,circle,cjk-ideographic,square,georgian,decimal,decimal-leading-zero,lower-roman,upper-roman,lower-alpha,upper-alpha,lower-latin,upper-latin,hebrew,armenian） 7 list-style-image属性 8 list-style-position属性（两种取值：inside和outside） 9 list-style属性 list-style：列表项目符号 列表项目符号的位置 列表项目图像； 10 背景图像定义列表项目符号
1创建超链接[属性：href和target（_self和_blank）] 〈a href=“跳转目标” target=“目标窗口的弹出方式”〉文本或图像〈/a〉 2锚点链接 3链接伪类控制超链接 4种状态：a：link,a：visited,a：hover,a：active
1认识浮动（选择器｛float：属性值；｝） float常用属性值：left标签向左浮动,right标签向右浮动,none标签不浮动（默认值） 2清除浮动（选择器｛clear：属性值；｝） clear常用属性值：left清除左侧浮动影响,right清除右侧浮动影响,both同时清除左右两侧浮动影响 使用空标签清除浮动（clear：both） 使用overflow属性清除浮动（overflow：hidden） 使用after伪对象清除浮动 after｛ display：block； clear：both； content：“”； visibility：hidden； height：0； ｝
overflow属性（选择器｛overflow：属性值；｝｛overflow－x/y：属性值｝） overflow常用属性值：visible内容不会被修剪，会呈现在标签框之外（默认值）；hidden溢出内容被修剪，且修剪内容不可见；auto在需要时产生滚动条，即自适应所要显示的内容；scroll溢出内容被修剪，且浏览器会始终显示滚动条
1 认识定位属性（定位模式 边偏移） 定位属性（选择器｛position：属性值；｝） position常用属性值：static自动定位、relative相对定位、absolute绝对定位、fixed固定定位 边偏移（属性取值为数值或百分比） 边偏移属性：top顶端偏移量、bottom底部偏移量、left左侧偏移量、right右侧偏移量 2 定位类型（静态、相对、绝对、固定） 静态定位position取值static（无法通过边偏移改变标签位置） 相对定位position取值relative（可以通过边偏移改变标签位置） 绝对定位position取值absolute 固定定位position取值fixed 3 z-index层叠等级属性（取值可为正整数、负整数和0，0为默认属性值，取值越大，定位元素在层叠元素中越居上） z-index仅对定位元素有效