css
文章平均质量分 69
苦海123
专研前端,探索后端,热爱技术,不断汲取
展开
-
less简介、less安装、编译、less语法之变量、嵌套、类混入、函数混入、运算、less文件导入
less基础:CSS是一门非程序语言,没有变量、函数、作用域等,此时使用rem单位就会出现图片等大量计算尺寸的问题,但是less可以轻松实现运算,它是CSS预处理语言,引入了变量、混入、函数等,常见的CSS预处理语言还有:Sass、Stylus等,Less中文网址:http://lesscss.cnLess安装:①安装nodejs:进网址:http://nodejs.cn/download,选择对应自己电脑系统的node下载安装,检查是否安装成功:cmd控制台键入 node -v , 若出现有node原创 2021-04-27 09:10:07 · 1214 阅读 · 0 评论 -
移动web现状、viewport视口、二倍图、移动web开发主流方案、布局技术选型(流式布局、flex弹性布局、less+rem+媒体查询布局、混合布局、媒体查询、bootstrap)
移动端web现状:移动端常见浏览器:UC浏览器,QQ浏览器,Opera浏览器,百度手机浏览器,360安全浏览器,谷歌浏览器,搜狗手机浏览器,猎豹浏览器及杂牌浏览器。移动端常见的浏览器都是基于webkit内核开发的,国内机操作系统也是基于Android开发的,因此在移动开发中只兼容主流浏览器,即处理webkit内核浏览器即可。手机屏幕现状:移动设备的屏幕尺寸繁多,常见Android设备分辨率有:480x800、 480x854、 540x960、720x1280、1080x1920、2k、4k等;iPho原创 2021-04-27 08:53:10 · 1117 阅读 · 2 评论 -
控制元素显示和隐藏的方式及区别、内容溢出处理(区域滚动)、透明性、字体图标、常见字体、自定义字体设计、网站图标、CSS代码分析
元素的显示与隐藏:常见控制元素的显示和隐藏的属性有display、visibility、overflow,需要清除的理解三者之间的区别。display显示:当值为none时为隐藏对象,不保留原位置,当值为block时为显示对象。visibility可见性:当值为hidden时为隐藏对象,保留原位置,当值为visible时为可见对象。overflow溢出:控制当内容超出对象时如何管理内容的显示,其值visible不添加滚动条也不剪切内容、auto内容超出时显示滚动条,不超出时不显示滚动条、hid原创 2021-04-16 12:38:33 · 612 阅读 · 0 评论 -
CSS中文档流之普通流,浮动及定位、浮动特性及清除浮动的方式、定位模式,子绝父相搭配定位方式、z-index层级
文档流:普通流(normal flow):字面意思是普通流或者标准流,也就是常说的文档流,指网页内标签正常是从上到下,从左到右排列的意思,css的定位机制有3种:普通流(标准流)、浮动、定位。浮动:是指使元素飘起来不完全脱离标准流的控制,绝对定位才是完全脱离标准流的,飘起来后不会再占原来的位置,浮动可以使块级元素在一行排列显示,float的值有:none默认值,元素不浮动、right元素向右浮动、left元素向左浮动。.box ul li { float:left;}浮动特性:1、浮动原创 2021-04-16 12:18:52 · 366 阅读 · 0 评论 -
CSS中盒子模型、嵌套盒子中垂直外边距塌陷问题解决方案、标准盒模型、怪异盒模型
盒子模型(Box Model):指把HTML页面中的元素看作是一个矩形的盒子,也称容器,这个盒子从内到外由:元素的内容(content)、内边距(padding)、边框(border)、外边距(margin)组成。内容content:指文本等内容的大小,width和height设置内容的大小,并非包含边框border和内边距padding的值,因此设置其它两项,容器的实际大小会改变。设置其它两项后,经常会出现盒子被撑开的问题,其中一种解决方法就是修改width和height,结合下面内边距设置属性值原创 2021-04-16 12:05:02 · 863 阅读 · 0 评论 -
CSS中背景颜色、背景图片、渐变色、背景定位、精灵图(雪碧图)介绍
背景background:背景可以设置为颜色和图片,设置为图片时,可以对图片继续设置。background-color:设置背景颜色:其颜色的取值方式前面提到过,和color的取值一样,但是默认值transparent透明body { background-color: #332211;}background-image:设置背景图片:其值为:none默认值无背景、url(图片地址),图片地址无需加引号。body { background-image: url(images/tes原创 2021-04-16 11:57:31 · 1086 阅读 · 0 评论 -
CSS中的层叠性、继承性、优先级、权重
css三大特性:三大特性:层叠性、继承性、优先级层叠性:指多种css样式的叠加,是浏览器处理多种css样式冲突的能力,如果给一个元素通过不同或者相同的选择器设置相同的属性但属性值不同时,权重相同的情况下,冲突属性后面的属性(值)会把前面的属性(值)层叠(覆盖)。p { color: red;}p { color: yellow;/* 后面的属性会把前面的属性覆盖掉 */}<p>显示的为yellow色</p>继承性:指子元素会继承父标签的某些样式,给父标签原创 2021-04-16 11:48:44 · 240 阅读 · 0 评论 -
css书写规范、行高
css书写规范:空格规范:选择器与花括号{之间必须包含空格,属性冒号:后面和属性值必须包含空格.text { font-size: 16px;}选择器规范:当有多个选择器同时出现时,每个选择器必须独占一行.box,.nav,.mainbox { background-color:lightblue;} 选择器嵌套层级规范:选择器嵌套层级不大于3级。属性规范:定义每一个属性时应该另起一行。p { font-size: 16px; color: yellow;原创 2021-04-15 16:20:35 · 254 阅读 · 0 评论 -
css中标签显示模式、块元素、行内元素、行内块元素、显示模式转换
标签显示模式display:HTML标签一般分为块标签(块元素:block-level)和行内标签(行内元素:inline-level)两种类型,但是还有第三种说法行内快元素:table-row-group:设置元素为表格行组显示,display值总结如下表:块元素block-level:独占一行,可以设置宽度、高度、对齐等属性,常见的块标签:h1~h6、p、div、ul、ol、li等。行内元素(内联元素)inline-level:一行可排列多个行内元素,一般不能设置宽度、高度、对齐等属性,但是原创 2021-04-15 16:15:26 · 493 阅读 · 0 评论 -
css设置字体颜色、文本对齐方式、首行缩进、文本装饰、列表样式、鼠标样式、禁止文本域拖拽、轮廓线、块级元素对齐方式、文字溢出设置
color:设置字体颜色:取值方式有:1.颜色值red,green等 、2.十六进制#FF0000,#FF2313等、3.RGB代码rgb(225,225,112)或rgb(100%,55%,0%),取值范围0-225,0%-100%,rgba是rgb的扩展,其中第四个参数设置的是透明度,取值范围为0-1,注意:IE低版本不支持此属性,低版本IE需要:filter:Alpha(opacity=50),opacity值为0 到 100,如下:p{ color:rgba(112,33,65,0.7);/原创 2021-04-15 16:06:08 · 774 阅读 · 0 评论 -
CSS设置字体大小、字体粗细、字体风格
font-size:设置字体大小:该属性值的单位可以使用相对单位和绝对单位,推荐使用相对定位中的px。(浏览器能够识别的最小像素是12px)p{ font-size:20px;}常见尺寸单位:font-family:设置字体:如果需要设置多个字体样式,则属性值可以写多个中间用逗号隔开即可,需要知道的是浏览器会从第一个字体属性值找,直到找到自己设备有的字体显示,自己设备没有的字体,按设备默认字体显示,推荐系统默认字体。p{ font-family:"微软雅黑",Arial;}原创 2021-04-15 15:52:53 · 27138 阅读 · 1 评论 -
css中选择器介绍
选择器:选择器是用来选择目标元素的,选择器分基础选择器和复合选择器及伪类选择器。基础选择器:标签名{} /* 1 标签选择器:把某类标签全部选中,如下: */p{font-size:36px;}.类名{} /* 2 类选择器(class选择器):选中相同类名的元素,.声明,class调用,如下: */.box{width:100px;height:50px;}<div class="box"></div><div class="box stylebox">原创 2021-04-15 15:44:48 · 315 阅读 · 1 评论 -
CSS简介、行内样式、内部样式、外部样式、注释、引入其他CSS文件
CSS的发展历程:起初是没有css的,只有少量样式是可以写在html标签中,这样代码格外显得臃肿,此时CSS就出现了。初识CSS:CSS(Cascading Style Sheets),被称为CSS样式表或者层叠样式表,主要用于设置HTML页面内容外观及布局外观。css有三大模块:定位、浮动、盒子模型,下面有详细介绍。CSS书写位置:CSS书写位置可以分三种情况:行内样式(内联式)、内部样式表、外部样式(外链式)1.行内样式(内联式):在标签中添加style,并在style里面书写属性及属性值代原创 2021-04-15 15:40:38 · 1406 阅读 · 0 评论