background | 易学教程

Android中的图片视图的边框？

阅读更多关于 Android中的图片视图的边框？

3 月，跳不动了？>>> 如何为 ImageView 设置边框并在Android中更改其颜色？ #1楼这是我认识的一篇旧帖子，但我认为这可能会帮助那些人。如果要模拟不与形状的“实心”颜色重叠的半透明边框，请在xml中使用此边框。请注意，我根本不使用“stroke”标签，因为它似乎总是与实际绘制的形状重叠。 <?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android" > <item> <shape android:shape="rectangle" > <solid android:color="#55111111" /> <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" /> <corners android:radius="5dp" /> </shape> </item> <item> <shape android:shape="rectangle" > <padding android:bottom="5dp" android:left="5dp" android:right="5dp

CSS Media媒体查询使用大全，完整媒体查询总结

阅读更多关于 CSS Media媒体查询使用大全，完整媒体查询总结

前面的话　　一说到响应式设计，肯定离不开媒体查询media。一般认为媒体查询是CSS3的新增内容，实际上CSS2已经存在了，CSS3新增了媒体属性和使用场景(IE8-浏览器不支持)。本文将详细介绍媒体查询的内容媒介类型　　在CSS2中，媒体查询只使用于<style>和<link>标签中，以media属性存在　　media属性用于为不同的媒介类型规定不同的样式 screen 计算机屏幕（默认值） tty 电传打字机以及使用等宽字符网格的类似媒介 tv 电视类型设备（低分辨率、有限的屏幕翻滚能力） projection 放映机 handheld 手持设备（小屏幕、有限的带宽） print 打印预览模式 / 打印页 braille 盲人用点字法反馈设备 aural 语音合成器 all 适合所有设备　　真正广泛使用且所有浏览器都兼容的媒介类型是'screen'和'all' <style media="screen"> .box{height: 100px;width: 100px; background-color: lightblue;} </style> <div class="box"></div> 媒体属性　　媒体属性是CSS3新增的内容，多数媒体属性带有“min-”和“max-”前缀，用于表达“小于等于”和“大于等于”。这避免了使用与HTML和XML冲突的“<”和“>

常见的布局方式实现

阅读更多关于常见的布局方式实现

单列布局 HTML： <div class="parent"> <div class="child"></div> </div> 一.水平居中（常见的，那些什么table，导致性能不好的就不说了）实现效果： 1.使用inline-block和text-align实现 <style> .parent{ text-align: center; border: 1px solid red; } .child{ width: 50px; height: 50px; border: 1px solid #667766; background-color: bisque; display: inline-block; } </style> 原理： ①.text-align是指定元素文本的水平对齐方式，可继承， ②.inline-block行内块级元素，就是还是行内元素的排列方式不换行，但是支持块级元素有的宽高和上下padding 多个inline-block子元素会怎样？多个inline-block的间隙解决办法：在父级元素中加入font-size:0; 优点：兼容性好，缺点：需要同时设置子元素和父元素 2.使用margin:0 auto实现 .child{ width: 50px; height: 50px; border: 1px solid #667766; background

day15 CSS JS DOM初探

阅读更多关于 day15 CSS JS DOM初探

居中 line-hight 是上下 text-line 是左右实现一个返回顶部的功能： 1 先写好CSS 2 写动作JS 写一个悬浮菜单： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .pg-header{ margin: 0 auto; height: 48px; width:980px; background-color: aquamarine; color: coral; position: fixed; top: 0; left: 20px; right: 20px; line-height: 48px; text-align: center; } .pg-body{ margin: 0 auto; background-color: #dddddd; width:980px; height: 5000px; margin-top: 50px; } </style> </head> <body> <div class="pg-header">此处为菜单</div> <div class="pg-body">此处为内容</div> </body> </html> 效果：上下滚动菜单始终固定在顶部实现一个点赞按钮的效果： <

前端-css-长期维护

阅读更多关于前端-css-长期维护

############### CSS简介 ################ # CSS # HTML是骨架 # CSS是样式 # JS是动作 # css和html是分成两个文件编写的，这也是体现了文档内容和样式的解耦， # CSS：层叠样式表(英文全称：Cascading Style Sheets) ############### CSS的内容列表 ################ css的内容列表 1，css的引入，三种方式 2，css的选择器，基本选择器，有四种，p # . * 组合选择器，属性选择器分组和嵌套伪类选择器伪元素选择器选择器的优先级 3，css的各种属性，宽和高，width，height，字体属性，font-size，font-weight，color，文字属性，text-align，text-decoration，text-indent，背景属性，background-color，background-repeat，background-image，background-position， display 盒子模型，margin外边距，border边框，padding内填充，content内容 float，三种取值，left，right，none， clear，清除浮动， overflow，溢出属性，定位position， 4

css之background属性

阅读更多关于 css之background属性

background 简写属性在一个声明中设置所有的背景属性。可以按顺序设置如下属性： background -color　　　　　　背景颜色 background -image　　　　　背景图片 background -repeat　　　　　如何重复背景图片 background -attachment 背景图片是否固定或者随着页面的其余部分滚动 background -position 规定背景图像的位置如果不设置其中的某个值，也不会出问题，比如 background :#ff0000 url('smiley.gif'); 也是允许的。通常建议使用这个属性，而不是分别使用单个属性，因为这个属性在较老的浏览器中能够得到更好的支持，而且需要键入的字母也更少。默认值： not specified 继承性： no 版本： CSS1 JavaScript 语法： object .style. background ="white url(paper.gif) repeat-y" background-repeat的取值范围： repeat 默认。背景图像将在垂直方向和水平方向重复。 repeat-x 背景图像将在水平方向重复。 repeat-y 背景图像将在垂直方向重复。 no-repeat 背景图像将仅显示一次。 inherit 规定应该从父元素继承 background

HTML连载76-正方体和长方体

阅读更多关于 HTML连载76-正方体和长方体

一、如何编辑出一个正方体上后下前的顺序编写，最后在写左右 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>D184_3DTransformCube</title> <style> *{ margin:0; padding:0; } ul{ width: 200px; height: 200px; border: 1px solid black; box-sizing:border-box; margin:100px auto; position:relative; transform: rotateY(0deg) rotateX(0deg); transform-style: preserve-3d;/*转换成一个3D的面*/ } li{ list-style: none; width: 200px; height: 200px; text-align:center; line-height:200px; font-size:60px; position:absolute; } ul li:nth-child(1){ background-color: red; transform:rotateX(90deg) translateZ(100px) ; } ul li:nth

网页布局基础

阅读更多关于网页布局基础

网页布局基础简介什么是网页布局？网页布局是网页制作的基础，使用DIV+CSS布局网页是基础中的基础。三种基本布局方式：流式布局，浮动布局，绝对定位布局。网页设计的特点：1：网页宽度可变 2头+内容主体（根据需要分栏）+页脚（不重要的内容）对长度设置百分比可实现网页自适应 W3C标准包括结构化标准语言，表现标准语言，行为标准语言，倡导结构，样式，行为分离。 CSS中，存在三种定位机制：标准文档流，浮动，绝对定位。标准文档流：从上到下，从左到右输出文档内容，由块级元素和行级元素组成。浮动：float属性left(左浮动) right(右浮动) none(不浮动) 元素会左移或右移，直至碰到容器为止。关于浮动的详细介绍参考我转载的《CSS浮动-float/clear》绝对定位： position属性拥有三种定位方式 1.静态定位(static) 2.相对定位(relative) 3.绝对定位(absolute fixed(固定定位)) 参考我前面的《CSS基础》有详细解释。相对定位的特点： 1.相对自身原有位置进行偏移 2. 仍处于标准文档流中，会占据原来的空间位置 3.拥有偏移属性和z-index属性，即空间层叠现象。绝对定位特点： 1.建立以包含块为基准的定位 2. 完全脱离了标准文档流 3.随即拥有偏移属性和z-index属性未设置偏移量时

关于BFC的一些事

阅读更多关于关于BFC的一些事

BFC的生成在实现CSS的布局时,假设我们不知道BFC的话,很多地方我们生成了BFC但是不知道.在布局中,一个元素是block元素还是inline元素是必须要知道的.而BFC就是用来格式化块状元素盒子,同样还有管理内连盒子的IFC等.那首先就来了解一下什么是FC. FC: Formatting Context指的是页面中的一个渲染区域,并且拥有自己的渲染规则.决定子元素如何定位,以及和其他元素的相互作用和联系. BFC: 块级格式化上下文, 是一个独立的块级渲染区域,只针对块级元素,有一套自己的渲染规则来约束块级盒子,与外部无关. 既然BFC是一块独立的渲染区域,那么这块区域在哪里,有多大, 这就有生成BDC的元素决定,CSS2.1中规定, 满足以下CSS声明的元素就会生成BFC. 根元素 float不为none overflow不为hidden display: inline-block, table-cell, table-caption (注意: 值为table会生成BFC是因为会默认生成一个匿名的table-cell,所以不是table生成了BFC) position: absolute, fixed BFC的约束浏览器对BFC约束如下: 1. 生成BFC的子元素会一个接一个的放置,在垂直方向上的起点是包含块的顶部,相邻的子元素之间的垂直距离由margin控制

第 2 章前端基础之CSS

阅读更多关于第 2 章前端基础之CSS

一、CSS语法 CSS规则由两个主要的部分构成：选择器，以及一条或多条声明。 1 ''' 2 selector { 3 property: value; 4 property: value; 5 ... property: value 6 } 7 ''' 例如： 1 h1 {color:red; font-size:14px;} 二、CSS的四种引入方式 1、行内式行内式是在标记的style属性中设定CSS样式，这种方式没有体现CSS的优势，不推荐使用。 1 < p style ="background-color: rebeccapurple" > hello yuan </ p > 2、嵌入式嵌入式是将CSS样式集中写在网页的<head></head>标签对的<style></style>标签对中。格式如下： <head> <meta charset="UTF-8"> <title>Title</title> <style> p{ background-color: #2b99ff; } </style> </head> 3、链接式将一个.css文件引入到HTML文件中。 < link href ="mystyle.css" rel ="stylesheet" type ="text/css" /> 4、导入式将一个独立的.css文件引入HTML文件中

订阅 background