![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CSS样式
balabal@
这个作者很懒,什么都没留下…
展开
-
选择器
###CSS选择器CSS3选择器规范地址: https://www.w3.org/TR/2011/REC-css3-selectors-20110929/CSS3选择最新选择器规范: https://www.w3.org/TR/selectors!---问题---! 1.css的全称是什么? 2.样式表的组成 3.浏览器读取编译css的顺序?1.基本选择器 /*通配符选择...原创 2019-08-18 16:54:29 · 72 阅读 · 0 评论 -
行内元素和块级元素的具体区别是什么?行内块元素又是什么
一,行内元素与块级元素的区别:1.行内元素与块级元素直观上的区别二、行内元素与块级元素的三个区别行内元素会在一条直线上排列(默认宽度只与内容有关),都是同一行的,水平方向排列。块级元素各占据一行(默认宽度是它本身父容器的100%(和父元素的宽度一致),与内容无关),垂直方向排列。块级元素从新行开始,结束接着一个断行。2.块级元素可以包含行内元素和块级元素。行内元素不能包含块级元素,只能...原创 2019-08-15 22:43:36 · 3649 阅读 · 0 评论 -
多图点击跳转超链接
思路-为了让图片能够跳转,这里使用超链接把图片包围住html标签部分 我是第一张图片 我是第二张图片 我是第三张图片 我是第四张图片 我是第五张图片 我是第六张图片 我是第七张图片 我是第八张图片 ...原创 2019-08-15 22:17:15 · 930 阅读 · 0 评论 -
无序列表,有序列表,自定义列表
无序列表UL格式:cssul{padding:0;list-style:none;}//把ul中的li的最前面before设置ul>li:before{//吧li设置为行内块display:inline-block;//设置边框1px yellow solid;修改圆点样式为content:“♥”}最后面ul>li>:after{disp...原创 2019-08-15 20:47:46 · 234 阅读 · 0 评论 -
简单实现二级导航
Document 全部分类 ...原创 2019-08-23 23:09:36 · 531 阅读 · 0 评论 -
多个图片布局
css部分#s1{display:flex;width:600px;height:400px;border:solid 1px red;/flex 布局默认不能折行,需要换行主动设置换行//flex-wrap:wrap 设置折行方法/flex-wrap:wrap;justify-content:center;//上下居中align-items:center;}.box...原创 2019-08-14 23:05:13 · 494 阅读 · 0 评论 -
css 简单的2d变形
旋转 deg为旋转角度transfrom:rotate(15deg);默认原点为50% 50% 中心点默认值 可以设置100 100 为右下角transfrom-origin:100% 100%;第一个参数为x轴,负值为左,正值为右,第二个参数为y轴正值为下,负值为上transfrom:translate(100px,100px)缩放transfrom:scale(1,2);倾斜...原创 2019-08-19 19:43:56 · 125 阅读 · 0 评论 -
隐藏元素的4种方法
1.将元素设置为隐藏,标签在文档流中不占位置display:none; 隐藏display:bloack;显示2.隐藏元素 但是文档流中位置还在,visibility:hidden;隐藏visibility:visible;显示3.设置标签的透明度,范围0~1 表示完全透明.1表示完全不透明opacty:0.5 半透明;4.通过rgba,可以设置透明度background-co...原创 2019-08-19 19:37:23 · 947 阅读 · 0 评论 -
弹性布局flex
开启弹性布局display:flex;设置主轴方向从上往下排列flex-direction:column;设置主轴方向 默认值为rowflex-direction:row;设置主轴方向为竖轴 从上往下进行排列flex-dirction:column;设置主轴方向为竖轴,从下往上进行排列;flex-dirction:column-reverse项目在主轴方向的对齐方式,默认为 f...原创 2019-08-19 15:13:20 · 87 阅读 · 0 评论 -
常用伪元素与伪类选择器
伪类:一般表示状态hover鼠标悬停状态visited a标签专用,表示访问过的元素fpcus": 当元素成为焦点时触发active 当元素被鼠标按下时触发伪元素元素内容中的第一个字first-letter选中元素中的第一行first-line在前缀添加元素before在后缀添加元素after...原创 2019-08-19 09:55:43 · 92 阅读 · 0 评论 -
bootststarap
###bootstrap简洁、直观、强悍的前端开发框架,让web开发更迅速、简单中文网 : http://www.bootcss.com/英文网 : http://getbootstrap.com/###容器流体布局容器容器的width为auto,只是两边加了15px的padding。固定布局 容器的width会随设备分辨率的不同而生产变化 分辨率阈值 w >=...原创 2019-08-18 16:56:42 · 65 阅读 · 0 评论 -
CSS预处理器
###lessless是一种动态样式语言,属于css预处理器的范畴,它扩展了 CSS 语言,增加了变量、Mixin、函数等特性,使 CSS 更易维护和扩展LESS 既可以在 客户端 上运行 ,也可以借助Node.js在服务端运行。less的中文官网:http://lesscss.cn/bootstrap中less教程:http://www.bootcss.com/p/lesscss/...原创 2019-08-18 16:56:10 · 68 阅读 · 0 评论 -
CSS媒体查询
###css3媒体查询css3媒体查询是响应式方案核心###媒体类型all 所有媒体(默认值)screen 彩色屏幕print 打印预览 projection 手持设备 tv 电视 braille 盲文触觉设备 embos...原创 2019-08-18 16:55:36 · 55 阅读 · 0 评论 -
ccs简单实现粘连布局功能
css部分html代码我是内容我是底部原创 2019-08-17 23:30:10 · 173 阅读 · 0 评论