css主题的文章列表，还有css的技术要点_第10页

关于css里大于号（>)的用法

之前用的css没涉及到这个问题，今天看到。知道大概用法，但不知道和普通的后代选择器有什么区别。到网上找了，其实w3c的css文档里有很详细明确的介绍（http://www.w3school.com.cn/css/css_selector_child.asp）。 ...

代码星球 ·2021-02-15

CSS里的引用@import、link

引入CSS的方法有两种，一种是@import，一种是link @importurl('地址');<linkhref="地址"rel="stylesheet"type="text/css"/>现在绝大部分的网站都采用后一种link方式，原因在于@import先加载HTML，后加载CSSlink先加载...

代码星球 ·2021-02-14

width和height不是全局，在css中必须有单位

虽然很多元素有width和height属性。但他们不是全局，但他们不是全局，但他们不是全局！！！比如div中就不能直接用。必须放在style中。并且有该属性的元素，使用可以不用单位，默认是像素。（html5规定还必须像素）<inputwidth="100">或者<inputwidth="100px"&...

代码星球 ·2021-02-14

css 如何使图片与文字在div中居中展示？

1.情景展示　　如何将图片与文字在div中一起居中展示？　　HTML片段<div><imgsrc="C:UsersMarydonDesktophead_no.jpg"/><span>Marydon</span><span>12345678900&l...

代码星球 ·2021-02-14

css 禁止录入中文

1.情景展示　　如何禁止输入框，输入中文字符？2.解决方案　　IE浏览器，可以使用ime-mode来实现UpdateTime--2016年12月15日19:52:16　　/*屏蔽输入法，可以用来禁止录入中文*/　　ime-mode:disabled;//IE兼容，chrome不兼容　　<inputty...

代码星球 ·2021-02-14

CSS3新特性

1.对于CSS3新特性，支持淘宝手机端页面：1<!DOCTYPEhtml>2<html>3<head>4<metacharset="utf-8"/>5<title>淘宝</title>6<metaname="viewp...

代码星球 ·2021-02-14

CSS/JavaScript hacks,browserhacks使用

1、网址http://browserhacks.com/2、使用（1）JavaScriptHacks浏览器js判断（2）条件注释hack（3）MediaQueryHacks媒体查询hack（4）Property/ValueHacks属性/值hack （5）SelectorHacks选择器hack ...

代码星球 ·2021-02-14

css zoom与scale区别

转自：http://www.zhangxinxu.com/wordpress/2015/11/zoom-transform-scale-diff/1、zoom的缩放是相对于左上角的；而scale默认是居中缩放；2、zoom的缩放改变了元素占据的空间大小；而scale的缩放占据的原始尺寸不变，页面布局不会发生变化；所以二...

代码星球 ·2021-02-14

css实现九宫格

原理：浮动+margin负边距示例代码：<!DOCTYPEhtml><htmllang="zh"><head><metacharset="UTF-8"/><title>css实现九宫格</title><styletype="text/css"...

代码星球 ·2021-02-14

CSS命名规范 BEM

良好的代码结构，HTML和css元素之间的关系，对于项目交付是很重要的！BEM解释：(1).block是BEM的区块(B)，包含内容和风格。如bootstrap框架的.container。 (2).block-element代表自子容器(E)。如bootstrap框架的轮播图，.carousel表示轮播图，c...

代码星球 ·2021-02-14

webpack css打包为一个css

1、安装npminstallextract-text-webpack-plugin--save-dev 2、项目目录：index文件夹下的index.css：body{background-color:#ccc;}.flex-div{display:flex;}index文件夹下的index2.css：p{t...

代码星球 ·2021-02-14

webpack 编译less/scss文件

1、安装插件处理less：npminstallless-loader--save-dev处理sass：npminstallsass-loader--save-dev2、项目目录： layer.less为：.layer{width:600px;height:200px;background-color:gree...

代码星球 ·2021-02-14

webpack 处理CSS

1、安装插件npmistyle-loadercss-loader--save-devnpmipostcss-loader--save-devnpmiautoprefixer--save-devnpminstallpostcss-import--save-devstyle-loader插件为：通过注入<style&...

代码星球 ·2021-02-14

CSS3 calc()函数使用

1、calc是什么？calc是英文单词calculate(计算)的缩写，用于动态计算长度值。calc()函数支持"+","-","*","/"运算；+和 -运算符的两边必须始终要有空白符。比如 calc(50%-8px)会被解析成为一个无效的表达式：一个百分比后跟一个负数长度值。而calc(8px+...

代码星球 ·2021-02-14

CSS3 选择器浏览器兼容性汇总 IE8

1、css选择器css（包括css1、css2和css3）有哪些选择器？http://www.w3school.com.cn/cssref/css_selectors.asp 2、CSS3选择器因为CSS1和CSS2选择器浏览器兼容性很好，因此本文主要讲解CSS3选择器，CSS3选择器一共有21个，他们为：3...

代码星球 ·2021-02-14