Css

一段css代码让弹窗在页面中居中

一段css代码让弹窗在页面中居中,在CSS文件中加入就可以了。position:fixed;top:50%;left:50%;transform:translateX(-50%)translateY(-50%);-ms-transform::translateX(-50%)translateY(-50%);-moz-t...

css去掉a超链接的下划线

去掉A链接下划线的代码a{text-decoration:none} ...
互联网报道 互联网报道·2021-04-24

前端基础-css(3)

一、文本属性和字体属性(常用的)1、文本属性  text-align:left|right|center|justify(两端对齐,只适用于英文);  /*对齐方式*/  color:色值;  /*文本颜色*/  text-indent:2em; /*首行缩进,建议单位...
代码星球 代码星球·2021-02-25

前端基础-css(2)

一、标准文档流      宏观的将,我们的web页面和ps等设计软件有本质的区别,web网页的制作,是个“流”,从上而下,像“织毛衣”。而设计软件,想往哪里画东西,就去哪里画。      标准文档流下...
代码星球 代码星球·2021-02-25

前端基础-css(1)

一、css的引入方式现在的互联网前端分三层:  HTML:超文本标记语言。从语义的角度描述页面结构。  CSS:层叠样式表。从审美的角度负责页面样式。  JS:JavaScript。从交互的角度描述页面行为CSS:CascadingStyleSheet,层叠样式表。CSS的作用就是给HTML页面标签添加各种样式,定义网...
代码星球 代码星球·2021-02-25

div+css3绘制基本图形

基本图形包括:矩形、圆角矩形、圆形、椭圆形、三角形、值线、弧这些图形的绘制用到了CSS圆角属性,不考虑IE8。下面的实现在chrome浏览器运行通过。 1.矩形比较简单,通过CSS设置宽度、高度、背景色即可。html:<divclass="rectangle"></div>css:.r...

css毛玻璃效果

毛玻璃其实就是磨砂玻璃,能够模糊的看清背后的风景,让人感觉有种朦胧美,让界面看上去有些层次感。比如:高大上啊,接下来肯定是眼馋手痒的过程。。。当然,用ps搞一个全景毛玻璃背景毫无疑问是最省事的,那接下来就没啥事可干了。当然nonono了。毛玻璃无疑就是种模糊了,少不了filterblur。最终效果(chrome):天气...
代码星球 代码星球·2021-02-25

网页中多个图标在一张图片上,使用css将各图标显示

现在的网页中显示很多图标算是常态,发现项目中页面上用到的图标都是单个图标单个文件,用的时候直接往页面上挂,这确实很常态。如果,网站是挂在外网上,或者网速过低,又大量使用图标的情况下,由于浏览器和服务器的并发连接数是受限的,通常是4~8个,那么图标显示过慢或者超时的情况就会发生。当然了,像采用CDN,或者按照浏览器的并发...

CSS画一个三角形

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <meta ...
代码星球 代码星球·2021-02-25

css如何实现垂直居中样式?

第一种:外层边框部分高度固定,内部块级结构居中html结构://<!---->注释掉空格<divclass="verMiddleouterLayerWrap"><!----><divclass="innerLayer"></div>style样式://通用样式...

CSS3布局篇(多列布局)

我们通过学习CSS3,能够创建多个列来对文本进行布局,就像报纸那样排版那样!可以参考详细说明:http://www.w3school.com.cn/css3/css3_multiple_columns.asp如下多列属性:column-count:规定元素应该被分隔的列数。column-gap:规定列之间的间隔。col...
代码星球 代码星球·2021-02-24

css3布局篇(双飞翼)

大家看到好多电商网站都见过经典三列布局,它也叫做圣杯布局,是KevinCornell在2006年提出的一个布局模型概念,这个在国内最早是由淘宝UED的工程师传播开来,在中国也有叫法是双飞翼布局,它的布局要求有以下的几点:1、三列布局,中间宽度就自适应,目的都是左右两栏固定宽度; 2、在执行代码时候,代码是从上...
代码星球 代码星球·2021-02-24

CSS3 @media 查询(制作响应式布局)

 这里简单说明一下@media查询。详细说明文档:http://www.runoob.com/cssref/css3-pr-mediaquery.html使用@media查询,你可以针对不同的媒体类型定义不同的样式。@media可以针对不同的屏幕尺寸设置不同的样式,特别是如果你需要设置设计响应式的页面,@me...

CSS制作红桃心

这里主要用到了before与after属性之前之后代码:<!DOCTYPEhtml><html><head><metacharset="UTF-8"><title>画画</title><style>#xing{width:100px;h...
代码星球 代码星球·2021-02-24

css制作三角形

这个图形忘了在哪里见过的,不过见过有一些网站有这种图形。我这里做了一个简单的练习,希望帮到有需要的人。代码:<!DOCTYPEhtml><html><head><metacharset="UTF-8"><title>图形</title><st...
代码星球 代码星球·2021-02-24