【10】CSS
关注
分享
扫一扫
主要记录CSS开发中的一些笔记。
林猛男
搬砖之路，风雨兼程。
展开
-
为什么第一个子元素设置margin-top父元素会跟着移动（附解决方案）
问题：有时当我们设置子元素的margin-top，但是却发现子元素没有出现上外边距的效果，反而是父元素出现了上外边距的效果。原因：边距重叠：一个盒子和其子孙的边距重叠。根据规范，一个盒子如果没有上补白和上边框，那么它的上边距应该和其文档流中的第一个孩子元素的上边距重叠。解决方案1、为父元素设置padding。#father { width: 300px; height:...原创 2018-09-22 18:56:01 · 13045 阅读 · 0 评论 -
div盒子在页面中水平垂直居中的几种方法。
使用CSS样式中的某些属性实现DIV盒子框在任何浏览器和不同分辨率的显示屏中垂直上下居中。原创 2017-08-01 16:30:21 · 5892 阅读 · 0 评论 -
CSS选取第几个标签元素：nth-child(n)、first-child、last-child
前言：今天码代码时候遇到的需求要选取前两个标签元素，查了资料记录下来~nth-child（n）、first-child、last-child用法注：nth-child(n)选择器匹配父元素中的第n个子元素。 n可以是一个数字，一个关键字，或者一个公式。原创 2017-10-03 11:37:16 · 78609 阅读 · 5 评论 -
css布局：table布局、两栏布局、三栏布局
css布局：table布局、两栏布局、三栏布局原创 2017-10-06 14:15:51 · 4635 阅读 · 1 评论 -
CSS中clear:left/right的含义及用法
CSS中clear:left/right的含义及用法一：定义clear语法：clear : none | left | right | both取值：none : 默认值。允许两边都可以有浮动对象left : 不允许左边有浮动对象right : 不允许右边有浮动对象both : 不允许有浮动对象“float是魔鬼，会影响其他相邻元素；但是clear是小白，其只会影响自身，不会对其他相邻元素造成影响！”原创 2017-11-09 20:37:37 · 3477 阅读 · 0 评论 -
CSS控制单行（多行）文本超出后隐藏or显示省略号（...）
文本超出部分隐藏一般分为单行和多行，下面主要介绍两种方法一、单行文本隐藏显示省略号.ljl { width: 200px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap;}二、多行文本超出显示省略号（常用方法1）1、（因使用了WebKit的CSS扩展属性，该方法适...原创 2018-08-31 21:47:13 · 10281 阅读 · 0 评论 -
设置input 中placeholder的样式
一、效果二、代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> :原创 2018-10-01 14:05:39 · 38952 阅读 · 1 评论 -
设置padding会把div撑开的原因以及解决办法
因为Div添加了内边距属性，Div的实际宽度=Div的初始固定值+边距值（高度同理）例如Div设定为宽度为100px，添加5px的上下左右内边距，该Div的最后宽度为100+5+5=110px。CSS padding 属性定义元素边框与元素内容之间的空白区域。内边距数值设置相同，只需要写成：padding:10px;padding 接受长度值或百分比值，但不允许使用负值所以如果需要给...原创 2018-10-03 13:08:06 · 18865 阅读 · 3 评论 -
如何让背景图片平铺满整个浏览器页面
效果图代码&lt;!DOCTYPE html&gt;&lt;html lang="zh-CN"&gt; &lt;head&gt; &lt;meta charset="UTF-8"/&gt; &lt;title&gt;&lt;/title&a原创 2018-11-28 19:23:13 · 13352 阅读 · 1 评论