当前位置:首页 > CSS编程 > css基础

css基础

CSS 属性选择器

1

CSS属性选择器具有特定属性的HTML元素样式具有特定属性的HTML元素样式不仅仅是class和id。注意:IE7和IE8需声明!DOCTYPE才支持属性选择器!IE6和更低的版本不支持属性选择器。属性选择器下面的例子是把包含标题(titl

CSS Float(浮动)

4

functionremoveElement(numId){document.getElementById(numId).style.display="none";}.imgbox{float:left;text-align:center;w

CSS3 边框

1

CSS3边框CSS3边框用CSS3,你可以创建圆角边框,添加阴影框,并作为边界的形象而不使用设计程序,如Photoshop。在本章中,您将了解以下的边框属性:border-radiusbox-shadowborder-imageCSS3圆角

CSS 伪元素

0

CSS伪元素CSS伪元素是用来添加一些选择器的特殊效果。语法伪元素的语法:selector:pseudo-element{property:value;}CSS类也可以使用伪元素:selector.class:pseudo-element{

CSS3 框大小

4

CSS3框大小#div1{width:300px;height:100px;border:1pxsolidblue;box-sizing:content-box;}#div2{width:300px;height:100px;padding

CSS 选择器

3

CSS选择器CSS(层叠样式表)提供了多种选择器,用于选择要应用样式的HTML元素。CSS选择器用于选择你想要的元素的样式的模式。下列表格中的"CSS"列表示在CSS版本的属性定义,CSS1、CSS2和CSS3是层叠样式表(Cascadin

CSS3 字体

0

CSS3字体CSS3@font-face规则使用以前CSS的版本,网页设计师不得不使用用户计算机上已经安装的字体。使用CSS3,网页设计师可以使用他/她喜欢的任何字体。当你发现您要使用的字体文件时,只需简单的将字体文件包含在网站中,它会自动

CSS 组合选择符

3

CSS组合选择符CSS组合选择符组合选择符说明了两个选择器之间的关系。CSS组合选择符包括各种简单选择符的组合方式。在CSS3中包含了四种组合方式:后代选择器(以空格分隔)子元素选择器(以大于>号分隔)相邻兄弟选择器(以加号+分隔)普

CSS 列表

1

CSS列表CSS列表属性作用如下:设置不同的列表项标记为有序列表设置不同的列表项标记为无序列表设置列表项标记为图像列表在HTML中,有两种类型的列表:无序列表ul-列表项标记用特殊图形(如小黑点、小方框等)有序列表ol-列表项的标记有数字或

CSS 布局 – 水平 & 垂直对齐

4

CSS布局-水平&垂直对齐水平&垂直居中对齐元素居中对齐要水平居中对齐一个元素(如<div>),可以使用margin:auto;。设置到元素的宽度将防止它溢出到容器的边缘。元素通过指定宽度,并将两边的空外边距平均分配:div元素

CSS3 多列

2

CSS3多列CSS3可以将文本内容设计成像报纸一样的多列布局,如下实例:.newspaper{border:1pxblacksolid;padding:15px;-webkit-column-count:3;/*Chrome,Safari,

CSS 提示工具(Tooltip)

3

CSS提示工具(Tooltip)本文我们为大家介绍如何使用HTML与CSS来创建提示工具。基础提示框(Tooltip)提示框在鼠标移动到指定元素上显示:HTML代码:<style>/*Tooltip容器*/.tooltip{po

CSS vertical-align 属性

3

cssvertical-align属性实例垂直对齐图像:img{vertical-align:text-top;}属性定义及使用说明vertical-align属性设置一个元素的垂直对齐方式。该属性定义行内元素的基线相对于该元素所在行的基线

CSS 下拉菜单

5

.dropbtn{background-color:#4CAF50;color:white;padding:16px;font-size:16px;border:none;cursor:pointer;}.dropdown{position

CSS text-align 属性

2

csstext-align属性实例h1,h2,和h3元素设置文本的对齐方式:h1{text-align:center}h2{text-align:left}h3{text-align:right}在此页底部有更多的例子。属性定义及使用说明t

CSS3 过渡

1

.animated_div{width:60px;height:40px;background:#92B901;color:#ffffff;position:absolute;font-weight:bold;font-size:15px;

CSS 图片廊

1

CSS图片廊.responsive.img{border:1pxsolid#ccc;}.responsive.img:hover{border:1pxsolid#777;}.responsive.imgimg{width:100%;heig

CSS3 简介

4

CSS3简介CSS3已完全向后兼容,所以你就不必改变现有的设计。CSS3模块CSS3被拆分为"模块"。旧规范已拆分成小块,还增加了新的。一些最重要CSS3模块如下:选择器盒模型背景和边框文字特效2D/3D转换动画多列布局用户界面CSS3建议

CSS3 弹性盒子

1

CSS3弹性盒子(FlexBox)弹性盒子是CSS3的一种新的布局模式。CSS3弹性盒(FlexibleBox或flexbox),是一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有恰当的行为的布局方式。引入弹性盒布局模型的目的是提

响应式 Web 设计 &#8211; 媒体查询

2

响应式Web设计-媒体查询媒体(media)查询在CSS3上有介绍:CSS3@media查询。使用@media查询,你可以针对不同的媒体类型定义不同的样式。实例如果浏览器窗口小于500px,背景将变为浅蓝色:@mediaonlyscreen