
css
文章平均质量分 70
grt要一直一直努力呀
好好工作 好好生活 好好爱人
展开
-
css浮动float
css提供了三种传统布局的方式(就是盒子如何进行排列顺序)普通流(标准流)浮动定位在实际开发中,一个页面基本上都包含了以上三种布局方式。普通流(标准流)标签按照默认规定好的方式排列。像块级元素一行只能放一个,行内元素一行可以放多个。之前学习的均为标准流,是最基本的布局方式。浮动有很多的布局效果,使用标准流无法完成,可以使用浮动完成布局。。采用浮动可以改变元素标签默认的排列方式。网页布局第一准则:多个块级元素纵向排列找标准流,多个块级元素横向排列找浮动。...原创 2021-09-27 12:11:20 · 83 阅读 · 0 评论 -
css圆角边框、盒子阴影
文章目录圆角边框语法得到圆形得到圆角矩形盒子阴影语法圆角边框语法css3新增的圆角边框样式,使盒子变成圆角的。语法为 border-radius: length;参数值length,参数值可以以像素px为单位,也可以以百分比的形式。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible"原创 2021-09-26 10:40:21 · 250 阅读 · 0 评论 -
css综合案例2
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do原创 2021-09-25 17:51:18 · 91 阅读 · 0 评论 -
css中ps的基本操作
首先打开需要测量的图片。需要 ctrl+R 调出标尺。注意单位为像素。放大视图为ctrl+加号,缩小视图为ctrl+减号。移动图片应按住空格键。利用选区,工具栏第二个。可以测量大小。ctrl+D可以取消选区。或点击旁边空白处。还有取色...原创 2021-09-25 17:05:56 · 179 阅读 · 0 评论 -
css盒子模型
网页布局页面布局有三大核心,分别是盒子模型、浮动和定位。网页布局的过程是先准备好相关的网页元素(标签),基本都是盒子Box。利用css设置好盒子样式后,摆放到对应位置。(最复杂)往盒子里面装内容。盒子模型的组成css盒子模型包括边框(border)、外边距(margin)、内边距(padding)和实际内容(content)。内容与边框的距离为padding,盒子与盒子之间的距离为margin。边框border在css中,可以通过border来设置元素的边框。一个边框有三部分组成:边原创 2021-09-23 20:29:57 · 124 阅读 · 0 评论 -
css三大特性
css三大特性有层叠性、继承性和优先级。层叠性层叠性是指 相同的选择器,相同的样式,其中的值不同。则此时一个样式会覆盖另一个冲突的样式。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport"原创 2021-09-23 16:55:23 · 78 阅读 · 0 评论 -
css的背景
背景颜色background-color背景图片background-image:实际开发中,常用于logo或装饰性小图片或超级大的背景。语法格式为 background-color: url(url地址)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=e.原创 2021-09-22 21:58:41 · 88 阅读 · 0 评论 -
案例:简洁版小米侧边栏
需要用到的辅助工具是 像素尺子和截图工具 snipaste。使用snipaste不仅可以截图,还可以吸取颜色值。按住alt键即可。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" con.原创 2021-09-22 21:07:57 · 230 阅读 · 0 评论 -
css元素显示模式
根据标签特点的不同,可以把标签分为不同的种类。元素显示模式是指元素(标签)以什么方式进行显示。可以把HTML标签划分为两大类,分别是块元素和行内元素。像div就是块元素,独占一行。span是行内元素,一行可以有多个span。块元素常见的块元素有标题标签、p标签、div标签、ul、ol、li标签等。块元素的特点:独占一行。高度、宽度、外边距以及内边距都可以控制。宽度默认是容器(父级宽度)的100%是一个容器。里面可以放行内或块级元素。像标题标签、p标签这类的文字标签,里面是不能放其他原创 2021-09-22 20:12:39 · 69 阅读 · 0 评论 -
css复合选择器
文章目录后代选择器子选择器并集选择器伪类选择器链接伪类选择器复合选择器是建立在基础选择器之上,对基础选择器进行组合形成的。复合选择器包括后代选择器、子选择器、并集选择器和伪类选择器。后代选择器可以选择父元素里面的子元素。语法:元素1 元素2 { 样式声明 }<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-U原创 2021-09-19 10:03:27 · 80 阅读 · 0 评论 -
css的引入方式
内部样式表是写到html页面内部,将所有的css代码抽取出来,单独放到一个< style >标签中。通过这种方式,可以方便的控制整个页面元素的样式。行内样式表是在元素标签内部的style属性中设置css样式,适用于简单的修改样式。外部样式表实际开发中,外部样式表使用最为广泛。适用于样式比较多的情况下。单独建立一个css文件,仅为css的代码,然后引入到html页面中使用。引入的话使用link标签。<link rel="stylesheet" href="css文件路径"&原创 2021-09-16 16:33:27 · 60 阅读 · 0 评论 -
css文本属性
文本属性可以定义文本的外观,例如文本的颜色、对齐文本、装饰文本、文本缩进、行间距等。color属性用于定义文本的颜色颜色除了使用预定义的颜色值,red、blue和green等。也可以使用十六进制表示,在实际开发中,可以使用吸管工具,吸取颜色值。text-align用于设置对齐文本text-align属性用于设置元素内文本内容的水平对齐方式。text-decoration属性用于装饰文本可以给文本添加下划线、删除线和上划线。一般常用于给链接标签去除下划线。text-indent用于段落的首行缩原创 2021-09-16 15:58:41 · 74 阅读 · 0 评论 -
css设置文字属性
css的字体属性用于定义字体系列、大小、粗细和文本样式等。一般情况下会给body设置字体。各种字体之间需要用英文状态下的逗号分隔开。首先看浏览器中有无第一个字体,如果有,就用这个。如果没有,就用下一个。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"&g原创 2021-09-14 16:49:54 · 391 阅读 · 0 评论 -
前端css选择器
文章目录简介css选择器标签选择器类选择器id选择器通配符选择器简介css的主要使用场景是美化网页,布局页面。CSS是层叠样式表的简称。也称为CSS样式表或级联样式表。一个css的构成为:选择器以及一条或多条声明。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="I原创 2021-09-14 16:16:34 · 197 阅读 · 0 评论