原文:CSS躬行记（1）——CSS基础拾遗一、box-decoration-break CSS3新增的box-decoration-break属性可指定行内非替换元素在跨行、跨列或跨页时的样式渲染，它包含两个值： （1）slice：默认值，盒子会被分割成多部分。 （2）clone：断开的各个盒子会单独渲染。 下面用一个示例来演示两种的区别，第一个span元素采用box-decoration-break的默认值，效果如第一张图所示，在断行处没有左右内边距和圆角；第二个span元素bo...
<pre>标签的主要作用是预格式化文本。被包围在 pre 标签中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。<pre>标签的一个常见应用就是用来表示计算机的源代码。当然你也可以在你需要在网页中预显示格式时使用它。会使你的文本换行的标签（例如<h>、<p>）绝不能包含在 <pre> 所定义的块里。尽管有些浏览器会把段落结束标签解释为简单地换行，但是这种行为在所有浏览器上并不都是一样的。原文：http://www.cnblogs.com/m...
CSS在标签属性上设置style样式 #id 选择器写在head标签里面，style标签中写样式，如下：<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title><style>#i1 {background-color: chartreuse;height: 80px;}</style></head> <body><div id="i1"><p>aa</p><p>bb</p><p>cc</p></div> </body> </html> .class选择器同样是写在head标签里，style标签中写样式，但是这次不通过id调用，而是通过class调用（这...
html负责结构，css负责样式，js负责行为。 css写在head标签里面，容器style标签。 先写选择器，然后写大括号，大括号里面是样式。 1 <style type="text/css"> 2 body{ 3 background-color: pink; 4 } 5 </style>常见属性： 1 h1{ 2 color:blue; 3 font-size: 60px; 4 font-weight: normal; 5 text-decoration: underline; 6 font-style: italic; 7 }2.1 标签选择器就是用标签名来当做选择器。 1） 所有标签都能够当...
1首先在 webroot文件夹下新建一个css文件 可以命名为style.css。效果图如下： 2 jsp引用css文件<head> <title>显示</title> <link rel="stylesheet" type="text/css" href=”style.css" /> </head>3 css文件的格式Css规则主要由选择器和声明组成。声明由属性和值组成。一条规则可以有多个声明。当然选择器也可以有多个中间用逗号隔开 在这个例子中，h1 是选择器，color 和 font-size 是属性，red 和...
1.新的表单属性：2.HTML5获取元素的新方法：document.getElementsByClassName()，通过元素的class属性名获取一个伪数组。document.querySelector();通过css选择器获取元素（css选择器：即标签选择器、id选择器、类选择器、子代选择器、后代选择器），获取到的是该选择器的第一个标签。一般用于选取后代标签。document.querySelectorAll();获取所有的选择器放到一个伪数组里。3.类名操作 原文：https://www.cnblogs.com/xiaoao/p/91...
css基础内容CSS 指层叠样式表 (Cascading Style Sheets)样式定义如何显示 HTML 元素样式通常存储在样式表中把样式添加到 HTML 4.0 中，是为了解决内容与表现分离的问题外部样式表可以极大提高工作效率外部样式表通常存储在 CSS 文件中多个样式定义可层叠为一一.css的引入方式1.直接在html标签元素内嵌入css样式<divstyle="font-size:14px; color:#FF0000;">行内引入</div>2.在html头部head部分内style声明插入代码<style>p{backgro...
一、CSS 列表样式列表项标志 list-style-type - list-style-type 属性用于控制列表中列表项标志的样式 - 无序列表: 出现在各列表项旁边的圆点 - 有序列表: 可能是字母、数字或另外某种计数体系中的一个符号 - 无序列表取值 - none : 无标记 - disc : 实心圆，为默认值 - circle : 空心圆 - square : 实心方块 - 有序列表取值 - none : 无标记 - decimal : 无标记 ...
CSS（层叠样式表）定义如何显示HTML元素1、CSS的三中引入方式：行内样式（内联），内部样式表，外部样式表。2、语法：CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明。每条声明由一个属性和一个值组成。3、选择器3.1 元素选择器 div{}3.3 类选择器 .cl{}3.4 ID选择器 #id{}3.5 属性选择器 [type=‘text’]{}优先级问题：内联》 ID选择器 》类选择器 》元素选择器4、尺寸（行内元素的宽和高不生效）width: max-width...
contentpaddingbordermargin 常见问题： W3C盒子下的width height和 IE盒子下的width height?W3C盒子下的width height padding内部的区域,即contentIE盒子下的width height margin内部的区域,即content+padding+border CSS3的解决方案/*以border为盒子界*/ box-sizing: border-box; 原文：http://www.cnblogs.com/WeWeZhang/p/5824364.html
盒子好比快递小哥的一个快递包裹。把这个包裹延着x轴切开，如下图所示：盒子的内容就是你网购的商品，盒子的填充就是包裹里面一些泡沫或者报纸保护运输的物品的安全，边框就是包裹的盒子，盒子的外边距是快递小哥来放置快递的时候，快递与快递的距离。对应到css中如上图所示。content只需确定 width 和 height 就能确定其大小。但是对span元素不适用。<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><style typ...
一、图片格式&Hack（尽量不要使用） IE6对图片png-24的透明效果不支持，IE6中背景会发灰，可以使用png-8来代替。但是使用png-8代替之后清晰度会有所下降。 使用js来解决该问题，但是需要引入一个外部的js文件。 有些代码只需要在指定浏览器中（主要指IE）执行，可以使用CSS Hack 来解决。 条件Hack，如<!-- [if IE]> 语句 <![endif]--> 只对IE浏览器有效，其他的浏览器会把它当成注释。 IE10以下的支持这种模式。 ...
position 规定元素的定位类型。参考链接：https://www.cnblogs.com/guolao/p/9048308.html static 默认值，正常布局，此时的top、right、bottom、left 属性无效。 absolute 绝对定位，相对于static 定位以外 的第一个父元素进行定位。 relative 相对定位，相对于static正常布局 进行定位。 fixed固定定位，相对于window固定，滚动浏览器窗口并不会使其移动，会脱离normal flow。原文：https://www.cnblogs.com/wuyuchu...
CSS全称为“层叠样式表 (Cascading Style Sheets)”，它主要是用于定义HTML内容在浏览器内的显示样式，如文字大小、颜色、字体加粗等。从CSS 样式代码插入的形式来看基本可以分为以下3种：内联式、嵌入式和外部式三种。内联式css样式，直接写在现有的HTML标签中.嵌入式css样式，写在当前的文件中.外部式css样式，写在单独的一个文件中css 样式由选择符和声明组成，而声明又由属性和值组成在英文大括号“｛｝”中的的就是声明，属性...
css基础系列教程:背景属性作者：www.divcss.com我们把上一节的作业的答案给大家公布一下：1、 h1 .p1{}：表示h1标签下的所有class为p1的选择符；2、 #content h1{}表示id为content下的所有h1标签；3、 h1 .p1，#content h1并列关系，对class为p1的和ID为#content下的H1作用同一个效果；4、 h1#content h2{} 表示h1下id为content标签下的h2标签，请注意这个地方不是包含没有空格而是紧接着写的。必须是属于H1里面ID为#content下...