css
文章平均质量分 91
Mars-xq
好记性不如烂笔头。
展开
-
css与jq中的显示与隐藏
CSS Display(显示) 与 Visibility(可见性) display属性设置一个元素应如何显示,visibility属性指定一个元素应可见还是隐藏。隐藏元素 - display:none或visibility:hidden 隐藏一个元素可以通过把display属性设置为”none”,或把visibility属性设置为”hidden”。但是请注意,这两种方法会产生不同的结果。 vi原创 2017-04-07 17:38:28 · 1108 阅读 · 0 评论 -
前端学习指南
前端技能:H5 CSS3 JavaScript gulp webpack 等Node.js安装及环境配置之Windows篇 windows下nodejs环境配置windows下nodejs环境配置快速理解掌握gulp用法 gulp详细入门教程一小时包教会 —— webpack 入门指南 入门Webpack,看这篇就够了SASS中文网 Less.js 中文文档 该使用S...原创 2018-02-08 10:26:23 · 9875 阅读 · 0 评论 -
css - display:table-cell的使用
参考:布局神器(一)display:table-celldisplay:table-cell指让标签元素以表格单元格的形式呈现,使元素类似于td标签。display: table与标签table的对比 示例:参考:css文档:display css中display设置为table、table-row、table-cell后的作用及其注意点<!DOCTYPE htm...原创 2018-02-08 15:22:17 · 12523 阅读 · 1 评论 -
css - 水平居中
参考:CSS常见布局及解决方案 把简单做好也不简单-css水平垂直居中文字水平居中对于单行文字来说,直接使用text-align: center即可。 多行文字可以看作一个块级元素参考margin法和定位法。1、margin法:子节点:margin + 定宽<html><head> <meta charset="utf-8"&...原创 2018-02-08 10:49:20 · 230 阅读 · 0 评论 -
css - 垂直居中
参考:CSS常见布局及解决方案 把简单做好也不简单-css水平垂直居中单行文本垂直居中需要满足两个条件:1.元素内容是单行,并且其高度是固定不变的。2.将其line-height设置成和height的值一样<div><span>这是一段文字</span></div>div{ width: 400px; h...原创 2018-02-08 10:48:34 · 422 阅读 · 0 评论 -
css - position属性
参考: css中position属性(absolute/relative/static/fixed) CSS之定位布局(position,定位布局技巧) CSS布局模型1.position:static:静态定位(默认)无特殊定位,对象遵循正常文档流。 top,right,bottom,left等属性不会被应用。2.position:relative:对象遵循正常文...原创 2018-02-08 10:30:41 · 286 阅读 · 0 评论 -
css - 左定宽+右自适应
参考:CSS常见布局及解决方案左定宽+右自适应 实现方法如下:1、position + margin:html lang="en">head> meta charset="UTF-8"> title>Titletitle> style> * { padding: 0; margi原创 2018-02-07 16:50:01 · 957 阅读 · 0 评论 -
css-flex布局
参考:Flex 布局教程:语法篇(阮一峰) Flex 布局教程:实例篇(阮一峰) 浅谈display:flex display:flex 布局教程容器默认存在两根轴:水平的主轴(main axis)和垂直的交叉轴(cross axis)。 主轴的开始位置(与边框的交叉点)叫做main start,结束位置叫做main end; 交叉轴的开始位置叫做cross start,结束位置原创 2018-02-06 15:59:09 · 618 阅读 · 0 评论 -
CSS - 七种三栏布局
转自:详解 CSS 七种三栏布局技巧1. 流体/浮动布局html lang="en">head> style> .left { float: left; height: 200px; width: 100px; background-color: red;原创 2018-02-06 16:09:38 · 229 阅读 · 0 评论 -
css - 圣杯布局和双飞翼布局
参考:Flex 布局教程:语法篇 Flex布局 那些年,奇妙的圣杯与双飞翼,还有负边距 CSS布局中圣杯布局与双飞翼布局的实现思路差异在哪里? CSS布局奇淫巧计之-强大的负边距 聊聊为什么淘宝要提出「双飞翼」布局圣马布局和双飞翼的流程:1、搭建 head content foot, content 内部的三个元素全部左浮动,然后清除浮动防止影响 foot 2、给 main 100% 的原创 2018-02-06 16:12:01 · 341 阅读 · 0 评论 -
css-overflow
overflow :溢出 属性规定当内容溢出元素框时发生的事情。这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll,不论是否需要,用户代理都会提供一种滚动机制。因此,有可能即使元素框中可以放下所有内容也会出现滚动条。默认值:visible可能的值visible //默认值。内容不会被修剪,会呈现在元素框之外。//内容太多会超出盒子hidden //原创 2017-03-17 15:56:09 · 494 阅读 · 0 评论 -
CSS选择器
参考: jquery、css 的选择器(逗号/空格/英文句号/大于号/加号/波浪号)备忘 常用css3选择器 还需要学习的十二种CSS选择器1、紧接无符号:表示并且.class1.class2 //表示当前标签2、逗号:表示多个选择器3、星号:表示所有4、点号:表示类选择器5、井号:表示id选择器6、方括号:表示属性选择器 a[title] {/*属性选原创 2018-01-26 16:03:24 · 250 阅读 · 0 评论 -
css-float浮动
参考: CSS浮动(float,clear)通俗讲解 CSS 浮动 overflow:hidden清除浮动原理解析及清除浮动常用方法总结 css清除浮动float的七种常用方法总结和兼容性处理BFC概念:定义:BFC(Block Formatting Context)全称是块级格式化上下文,用于对块级元素排版,默认情况下只有根元素(body)一个块级上下文,但是如果一个块级元素设置...原创 2018-02-01 17:10:26 · 240 阅读 · 0 评论 -
css - 水平垂直居中
参考:CSS常见布局及解决方案 把简单做好也不简单-css水平垂直居中1、父节点:relative + 子节点:absolute + transform<html><head> <meta charset="utf-8"> <style type="text/css"> .parent { ...原创 2018-02-08 10:49:07 · 267 阅读 · 0 评论 -
前端学习 : webstorm ide快速输入html等标签
参考: 前端学习总结(二十)那些你可能不知道却强大方便的WebStorm快捷键 webstorm批量编辑快捷键【跳转到指定行,批量输入】 Intellij idea 快捷键(1)–生成for循环代码块 WebStorm快捷键收集html lang="en">head> meta charset="UTF-8"> title>webstorm快键键title>h原创 2018-01-25 10:50:13 · 16603 阅读 · 0 评论 -
css盒子模型之定位
1、Static 定位HTML元素的默认值,即没有定位,元素出现在正常的流中。 静态定位的元素不会受到top, bottom, left, right影响。2、Fixed 定位元素的位置相对于浏览器窗口是固定位置。 即使窗口是滚动的它也不会移动:Fixed定位使元素的位置与文档流无关,因此不占据空间。 Fixed定位的元素和其他元素重叠。3、Relative 定位相对定位元素的定位是相对其正常原创 2017-04-28 15:38:01 · 394 阅读 · 0 评论 -
html中div内容居中的方法
方法1:table-celldiv中的内容居中:不改变盒子尺寸。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> div { background-color: red; widt原创 2017-03-27 09:46:30 · 79400 阅读 · 1 评论 -
css盒子模型的padding的误解,利用padding实现居中
一、Android中的图片使用padding摆放:<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_heigh原创 2017-03-25 13:13:02 · 2788 阅读 · 0 评论 -
css - BFC
参考:CSS定位的三种机制:普通流、绝对定位和浮动 外边距塌陷之clearance 前端精选文摘:BFC 神奇背后的原理 CSS学习笔记——深入理解BFC 浅析BFC及其作用BFC概念:块格式化上下文(Block Formatting Context,BFC) 它是 W3C CSS 2.1 规范中的一个概念,它决定了元素如何对其内容进行定位,以及与其他元素的关系和相互作用。...原创 2018-02-08 16:53:35 · 323 阅读 · 0 评论