文章分类 -  前端

css3--圆角、阴影、透明度
摘要:CSS3圆角、阴影、rgba CSS3圆角 设置某一个角的圆角,比如设置左上角的圆角:border-top-left-radius:30px 60px; 同时分别设置四个角: border-radius:30px 60px 120px 150px; 设置四个圆角相同:border-radius:50 阅读全文

posted @ 2019-11-25 19:51 cherry_ning 阅读(268) 评论(0) 推荐(0)

css3-选择器
摘要:CSS3新增选择器 1、E:nth-child(n):匹配元素类型为E且是父元素的第n个子元素 <style type="text/css"> .list div:nth-child(2){ background-color:red; } </style> ...... <div class="li 阅读全文

posted @ 2019-11-24 11:55 cherry_ning 阅读(144) 评论(0) 推荐(0)

css--权重
摘要:前端页面开发流程 1、创建页面项目目录 2、使用Photoshop对效果图切图,切出网页制作中需要的小图片 3、将装饰类图像合并,制作成雪碧图 4、结合Photoshop和代码编辑器,参照效果图,进行html和css代码书写,制作页面 CSS权重 CSS权重指的是样式的优先级,有两条或多条样式作用于 阅读全文

posted @ 2019-11-24 10:43 cherry_ning 阅读(113) 评论(0) 推荐(0)

html1.0+css+photoshop实例
摘要:天天生鲜首页: 天天生鲜登录页: 前端页面开发流程 1、创建页面项目目录 2、使用Photoshop对效果图切图,切出网页制作中需要的小图片 3、将装饰类图像合并,制作成雪碧图 4、结合Photoshop和代码编辑器,参照效果图,进行html和css代码书写,制作页面 1 <!DOCTYPE htm 阅读全文

posted @ 2019-11-24 09:19 cherry_ning 阅读(191) 评论(0) 推荐(0)

photoshop
摘要:常用图片格式 图片是网页制作中很重要的素材,图片有不同的格式,每种格式都有自己的特性,了解这些特效,可以方便我们在制作网页时选取适合的图片格式,图片格式及特性如下: 1、psd psd是photoshop的专用格式,UI设计师使用photoshop设计效果图,最后会将psd格式的效果图交付给前端工程 阅读全文

posted @ 2019-11-24 09:11 cherry_ning 阅读(127) 评论(0) 推荐(0)

css--布局实例
摘要:特征布局实例讲习 经过对前面知识点的巩固和加深,我们可以使用前面学习到的知识来制作实际开发中碰到的一些典型的布局,以此来达到综合应用知识的目的。 1、特征布局:翻页(所需知识点:盒模型、内联元素) 2、特征布局:导航条01(所需知识点:盒模型、行内元素布局) 3、特征布局:导航条02(所需知识点:盒 阅读全文

posted @ 2019-11-10 12:02 cherry_ning 阅读(141) 评论(0) 推荐(0)

css--背景background
摘要:background属性 属性解释 background属性是css中应用比较多,且比较重要的一个属性,它是负责给盒子设置背景图片和背景颜色的,background是一个复合属性,它可以分解成如下几个设置项: background-color 设置背景颜色 background-image 设置背景 阅读全文

posted @ 2019-11-07 23:55 cherry_ning 阅读(155) 评论(0) 推荐(0)

css--相对/绝对/固定/层级定位
摘要:定位 关于定位 我们可以使用css的position属性来设置元素的定位类型,postion的设置项如下: relative 生成相对定位元素,元素所占据的文档流的位置不变,元素本身相对文档流的位置进行偏移 absolute 生成绝对定位元素,元素脱离文档流,不占据文档流的位置,可以理解为漂浮在文档 阅读全文

posted @ 2019-11-07 22:51 cherry_ning 阅读(1244) 评论(0) 推荐(0)

css--浮动/清除浮动
摘要:文档流 文档流,是指盒子按照html标签编写的顺序依次从上到下,从左到右排列,块元素占一行,行内元素在一行之内从左到右排列,先写的先排列,后写的排在后面,每个盒子都占据自己的位置。 浮动特性 1、浮动元素有左浮动(float:left)和右浮动(float:right)两种 2、浮动的元素会向左或向 阅读全文

posted @ 2019-11-06 23:54 cherry_ning 阅读(106) 评论(0) 推荐(0)

css--块元素、内联元素、内联块元素
摘要:块元素、内联元素、内联块元素 元素就是标签,布局中常用的有三种标签,块元素、内联元素、内联块元素,了解这三种元素的特性,才能熟练的进行页面布局。 块元素块元素,也可以称为行元素,布局中常用的标签如:div、p、ul、li、h1~h6、dl、dt、dd等等都是块元素,它在布局中的行为: 支持全部的样式 阅读全文

posted @ 2019-11-04 23:41 cherry_ning 阅读(169) 评论(0) 推荐(0)

css--盒子模型/塌陷/元素溢出
摘要:盒子模型解释 元素在页面中显示成一个方块,类似一个盒子,CSS盒子模型就是使用现实中盒子来做比喻,帮助我们设置元素对应的样式。盒子模型示意图如下: 把元素叫做盒子,设置对应的样式分别为:盒子的边框(border)、盒子内的内容和边框之间的间距(padding)、盒子与盒子之间的间距(margin)。 阅读全文

posted @ 2019-11-02 11:07 cherry_ning 阅读(1114) 评论(0) 推荐(0)

css--选择器、表格样式
摘要:css选择器 常用的选择器有如下几种: 标签选择器,此种选择器影响范围大,建议尽量应用在层级选择器中。举例: 通过id名来选择元素,元素的id名称不能重复,所以一个样式设置项只能对应于页面上一个元素,不能复用,id名一般给程序使用,所以不推荐使用id作为选择器。举例: 通过类名来选择元素,一个类可应 阅读全文

posted @ 2019-11-01 22:26 cherry_ning 阅读(701) 评论(0) 推荐(0)

css--文本样式
摘要:css文本设置 常用的应用文本的css样式: color 设置文字的颜色,如: color:red; font-size 设置文字的大小,如:font-size:12px; font-family 设置文字的字体,如:font-family:'微软雅黑'; font-style 设置字体是否倾斜,如 阅读全文

posted @ 2019-10-31 22:59 cherry_ning 阅读(143) 评论(0) 推荐(0)

css--基本语法及页面引用
摘要:css基本语法及页面引用 css基本语法 css的定义方法是: 选择器 { 属性:值; 属性:值; 属性:值;} 选择器是将样式和页面元素关联起来的名称,属性是希望设置的样式属性每个属性有一个或多个值。代码示例: css页面引入方法: 1、外联式:通过link标签,链接到外部样式表到页面中。 2、嵌 阅读全文

posted @ 2019-10-30 23:42 cherry_ning 阅读(142) 评论(0) 推荐(0)

html--内嵌框架
摘要:html内嵌框架 html内嵌框架 <iframe>标签会创建包含另外一个html文件的内联框架(即行内框架),src属性来定义另一个html文件的引用地址,frameborder属性定义边框,scrolling属性定义是否有滚动条,代码如下: 内嵌框架与a标签配合使用 a标签的target属性可以 阅读全文

posted @ 2019-10-30 21:20 cherry_ning 阅读(183) 评论(0) 推荐(0)

html--表单
摘要:html表单 表单用于搜集不同类型的用户输入,表单由不同类型的标签组成,实现一个特定功能的表单区域(比如:注册),首先应该用<form>标签来定义表单区域整体,在此标签中再使用不同的表单控件来实现不同类型的信息输入,具体实现及注释可参照以下代码: get请求j结果: post请求结果: 阅读全文

posted @ 2019-10-30 21:01 cherry_ning 阅读(111) 评论(0) 推荐(0)

html--表格及传统布局
摘要:html表格 table常用标签 1、table标签:声明一个表格 2、tr标签:定义表格中的一行 3、td和th标签:定义一行中的一个单元格,td代表普通单元格,th表示表头单元格 table常用属性: 1、border 定义表格的边框 2、cellpadding 定义单元格内内容与边框的距离 3 阅读全文

posted @ 2019-10-29 22:00 cherry_ning 阅读(704) 评论(0) 推荐(0)

html--列表
摘要:html列表 有序列表 在网页上定义一个有编号的内容列表可以用<ol>、<li>配合使用来实现,代码如下: 在网页上生成的列表,每条项目上会按1、2、3编号,有序列表在实际开发中较少使用。 无序列表 在网页上定义一个无编号的内容列表可以用<ul>、<li>配合使用来实现,代码如下: 在网页上生成的列 阅读全文

posted @ 2019-10-29 21:56 cherry_ning 阅读(142) 评论(0) 推荐(0)

html--图像与链接
摘要:html图像、绝对路径和相对路径 html图像 <img>标签可以在网页上插入一张图片,它是独立使用的标签,通过“src”属性定义图片的地址,通过“alt”属性定义图片加载失败时显示的文字,以及对搜索引擎和盲人读屏软件的支持。 绝对路径和相对路径 像网页上插入图片这种外部文件,需要定义文件的引用地址 阅读全文

posted @ 2019-10-29 21:53 cherry_ning 阅读(193) 评论(0) 推荐(0)

html--概述
摘要:html概述和基本结构 html概述 HTML是 HyperText Mark-up Language 的首字母简写,意思是超文本标记语言,超文本指的是超链接,标记指的是标签,是一种用来制作网页的语言,这种语言由一个个的标签组成,用这种语言制作的文件保存的是一个文本文件,文件的扩展名为html或者h 阅读全文

posted @ 2019-10-29 21:51 cherry_ning 阅读(154) 评论(0) 推荐(0)

导航