CSS
এPlutus
这个作者很懒,什么都没留下…
展开
-
h5+C3面试题总结
一、块级标签和行内标签的区别:1.块级独占一行,行内可以与其他元素共享一行2.块级元素可以包含块级元素和行内元素 ,行内元素只能包含文本或者其它行内元素。3.块级元素可以直接设置宽高,行内元素不能直接设置宽高二、行内元素与块级元素总结:行内:<a></a>超链接<b></b>加粗 <span></span> 最常用的行内元素<img src="" alt=""> 图片<input type="t原创 2021-03-02 10:19:26 · 649 阅读 · 1 评论 -
加载不出css时用文字展示
方法一text-indent: 200px;white-space: nowrap;overflow: hidden;<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>淘宝网</title> <link rel="stylesheet" type="text/css" href="../css/淘宝网.css"/> </he原创 2021-02-01 16:16:17 · 88 阅读 · 0 评论 -
文本多余部分用...表示
单行文本white-space: nowrap; /* 文字到边界不换行展示 */overflow: hidden; /* 溢出边界部分文字隐藏 */text-overflow: ellipsis; /* 溢出部分用...展示 */多行文本PC端不好实现,大多都是直接文档末尾自己写的...然后overflow:hidden;...原创 2021-02-01 15:42:23 · 206 阅读 · 0 评论 -
浮动流——让父级元素包住子元素
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>浮动流</title> <!-- <link rel="stylesheet" type="text/css" href="../css/浮动流.css"/> --> <style> *{ margin: 0; padding: 0; }原创 2021-01-31 22:22:06 · 760 阅读 · 0 评论 -
margin塌陷、margin合并的解决
一、margin塌陷父子嵌套元素垂直方向的 margin,父子元素是结合在一起的,他们两个会取其中最大的值正常情况应该是父级相对于浏览器进行定位,子级应该相对于父级定位的但是 margin 塌陷是在父级相对于浏览器进行定位时,子级没有相对于父级定位,就像父级的棚子没有了一样子级相对于父级,就像塌陷了一样a.给父元素设置边框属性b.将原本设置给子元素的margin属性修改为设置父元素的paddingc.给父子级其中一个设置浮动属性d.给父子级其中一个设置position:abs原创 2021-01-31 21:51:44 · 183 阅读 · 1 评论 -
两栏布局
两栏布局方法一:通过position<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style>原创 2021-01-31 21:06:43 · 135 阅读 · 0 评论 -
CSS实例——远视图
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>远视图</title> <!-- <link rel="stylesheet" href="../css/远视图.css" /> --> <style> .content1{ width: 10px; height: 10px; bac原创 2021-01-31 18:32:07 · 886 阅读 · 0 评论 -
标签分类
标签的分类(归类)基本的1)行级元素,也叫内联元素 inline特点 A 内容决定元素所占位置 B 不可以通过 CSS 改变宽高例 span,strong,em,a,del行级元素自带 CSS 属性,可更改自带属性span 自带隐藏属性 display:inline; 可以通过改成 block 变成块级元素2)块级元素,block特点 A 独占一行 B 可以通过 CSS 改变宽高例 div,p,ul,li,ol,form,address3)行级块元素 inline-block特点 A原创 2021-01-31 12:12:02 · 439 阅读 · 0 评论 -
CSS代码块属性
以<div></div>为例,css 引入部分写成,用花括号包裹起来的是 css 代码区,在括号里面写 属性名:属性值; 每一个属性与属性之间用分号;隔开div{font-size:12px; //属性名:属性值;font-weight:bold;}下面来介绍一些属性,在 www. css88.com,相当于字典可以查...原创 2021-01-31 13:21:39 · 216 阅读 · 0 评论 -
初始化元素(改变 html 自带的系统属性)
初始化元素(改变 html 自带的系统属性,变成自定义标签)原创 2021-01-31 13:16:05 · 219 阅读 · 0 评论 -
CSS实例——三角形
利用border<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>三角形</title> <style> div{原创 2021-01-31 12:59:09 · 86 阅读 · 0 评论 -
CSS(下)
9.定位布局position: static:静态布局(默认文档流) absolute:绝对定位 特点: a.脱离默认文档流(飘起来了) b.默认根据body左上角进行定位 c.不保留定位前空间 d.如果父元素具有定位属性,根据父元素左上角进行定位 relative:相对定位 特点: a.不脱离默认文档流 b.默认根据元素本身位置进行定位 c.保留定位前空间 fixed:固定定位 固定定位的特点和绝对定位相似 使用了固定定位的元素,原创 2021-01-30 12:35:51 · 158 阅读 · 0 评论 -
CSS(中)
6.尺寸+颜色-单位尺寸: 1)绝对单位 Px 2)相对单位 百分比 1em~1个M的宽度(16px)颜色: 1.关键字 red blue 2.rgb(r,g,b) r:red g:green b:blue 0-255 3.rgba(r,g,b,a) a:apcaity透明度 0-1: 0:完全透明 1:完全不透明 4.16进制颜色值 # #ff0000 #fff:白色 #ccc:灰色 font-family:" "原创 2021-01-30 12:30:31 · 109 阅读 · 0 评论 -
CSS实例——呼吸灯
呼吸灯<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *{原创 2021-01-30 12:16:04 · 414 阅读 · 0 评论 -
CSS实例——轮播
animation动画(!!!注意要让块级元素浮动起来)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> div.ou原创 2021-01-30 10:58:41 · 79 阅读 · 0 评论 -
CSS实例——梦幻西游
animation动画<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *{原创 2021-01-30 10:48:54 · 168 阅读 · 0 评论 -
CSS让一个图片显示在另一个图片上面
CSS让一个图片显示在另一个图片上面思路,在两个图片的父元素上设置 position:relative , 然后给小图片设置 position:absolute ,位置通过top,bottom,left,right来修改,然后用 z-index 设置显示层级,小图的层级一定要比大图高。如下设置:...原创 2021-01-22 17:39:41 · 9884 阅读 · 1 评论 -
CSS(上)
什么叫CSS?cascading style sheet层叠 样式 表css不能脱离HTML单独存在语法a.属性的设置 属性名和属性值之间使用冒号分割 多对属性之间使用分号分割 最后一对属性可以不加分号 1.style <div style="width:100px; height:100px;background-color:red;"></div> 2.其他 代码块 选择器{ width:100px; height:100px;..原创 2021-01-18 11:38:39 · 85 阅读 · 0 评论