1 div在页面居中的问题 1）position值为relative时（相对定位），css设置属性margin:0 auto;(0 auto，表示上下边界为0，左右则根据宽度自适应相同值,即居中)即可。 2）position值为relative时（绝对定位），css设置属性 text-align:center; left:50%; margin-left:-500px;(左边距margin-left设置为当前div宽度的一半的负值即可). 代码示例： .page {position:absolute;width:1000px;background-image:none;text-align...
ylbtech-CSS3：CSS 听觉参考手册 1.返回顶部1、听觉样式表听觉样式表可把语音合成与音响效果相组合，使用户可以听到信息，而无需进行阅读。听觉呈现可用于：视觉能力低弱的人士帮助用户学习阅读帮助有阅读障碍的用户家庭娱乐在汽车中使用听觉呈现通常会把文档转化为纯文本，然后传给屏幕阅读器（可读出屏幕上所有字符的一种程序）。听觉样式表的一个例子：h1, h2, h3, h4 { voice-family: male; richness: 80; cue-before: url("be...
OOCSS是什么oocss是一个CSS框架，它的主要设计原则是：1.分离struct和skin（官方用到skin这个词，这里的skin跟内容不太一样。皮肤是用来extend基本的模块的，如果不设置皮肤，页面也可以精确地显示内容，并且内容有合理的位置和宽度和高度，但是没有特定的圆角或者颜色），这一点在后面有详细的说明2.分离容器和内容（所有的包含了一个独立块的div都可以认为是容器【或许html5里面的Article元素可以更准确地描述"容器"这个词】，容...
开发者工具（Chrome）此工具是我们的必备工具，以后代码出了问题，我们首先第一反应就是：“按F12”或者是 “shift+ctrl+i” 打开 开发者工具。菜单： 右击网页空白出---查看小技巧：1. ctrl+滚轮 可以 放大开发者工具代码大小。2. 左边是HTML元素结构 右边是CSS样式。3. 右边CSS样式可以改动数值和颜色查看更改后效果。 选择器 要想将CSS样式应用于特定的HTML元素，首先需要找到该目标元素。在CSS中，执行这一任务的样式规则部分被...
目录：1、Div+Css布局教程（-）CSS必备知识注：本教程要求对html和css有基础了解。一、CSS布局属性Width：设置对象的宽度（width:45px）。Height：设置对象的高度(Height:45px;)。Background：设置对象的背景颜色、背景图像。1.背景颜色background:#09F;2.背景图像background:url(file:///C|/Users/Administrator/Desktop/huipu.jpg) repeat-x;repeat-x代表横向重复，还可以设置repeat-y。Float: Float属性是DIV+CSS布局中最基本也...
1.设置页面的背景颜色body{margin:0px;background-color:lightskyblue;}<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>我的CSS</title></head><body><h1>我的CSS web页！</h1><p>Hello World！</p></body></html>2.设置不同元素的背景颜色1h1{ 2 background-color:roy...
CSS导航栏：http://www.w3school.com.cn/css/css_navbar.asp#导航栏基本上是一个链接列表，因此使用 <ul> 和 <li> 元素是非常合适的： 1水平导航栏：（此例子中链接的宽度不同）2<!DOCTYPE html>3<html>4<head>5<style>6ul7 {8list-style-type:none;9margin:0; 10padding:0; 11padding-top:6px; 12padding-bottom:6px; 13 } 14li 15 { 16display:inline; 17 } 18a:link,a:visited 19 { 20font-weight:bold; 21color:#FFFFFF; 22bac...
制作自己的导航条。HTML头部元素：<base> 定义了页面链接标签的默认链接地址<style> 定义了HTML文档的样式文件<link> 定义了一个文档和外部资源之间的关系练习样式表：行内样式表内嵌样式表外部样式表分别练习定义三类选择器：HTML 选择器CLASS 类选择器ID 选择器 <!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Hello my world</title><basehref="http://i1.sinaimg.cn/dy/weather/main/index14/007/icon...
<div class="box"><div class="box-con"><div class="box-text">昨日</div></div></div>?CSS .box {width: 180px;height: 100px;background: white;border-radius: 10px;-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);position: relative;z-index: 90;}.box .box-con{width: 85px;height: 88px;overflow: hidden;position: a...
列表类型（list-style-type）要影响列表的样式，最简单（同时支持最充分）的办法就是改变其标志类型。在一个无序列表中，列表项的标志 (marker) 是出现在各列表项旁边的圆点。在有序列表中，标志可能是字母、数字或另外某种计数体系中的一个符号。属性值有以下：list-style-type：none无标记list-style-type：disc默认，标记是实心圆list-style-type：circle 空心圆list-style-type：square实心方块list-style-type：decimal标记是...
<!DOCTYPE html><html><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>checkbox</title><style>.checkbox input {display: none;}.checkbox input+label {background: url(./checkbox1.png) left center no-repeat;background-size: 20px 20px;padding-left: 20px;}.checkbox input:checked+label {background...
<!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title><style>.emoji {width: 120px;height: 120px;margin: 15px 15px 40px;background: #FFDA6A;display: inline-block;border-radius: 50%;position: relative;}.emoji:after {position: absolute;bottom: -40px;f...
CSS书写规范https://www.aliyun.com/jiaocheng/636928.html1. CSS书写顺序1.1 位置属性(position,top,right,z-index,display,float 等) 1.2 大小(width,height,padding,margin) 1.3 文字系列(font,line-height,letter-spacing,color,text-align等) 1.4 背景(background,border等) 1.5 其他(animation,transition 等) 示例: 样式里边:先写位置,大小,文字系列,背景… 注意对齐,相差一个tab键的距离。习惯上冒号后边会空一个空格符。....
div(css layout的主要标签)、dl(定义列表) 、h1~h6(标题)、p(段落)、table(表格) , ul(非排序列表)特点: 会自动占据一定矩形空间，可以通过设置高度、宽度、内外边距等属性，来调整的这个矩形的样子 内联元素(inline element) a(超链接)、span(常用内联容器，定义文本内区块)、i(斜体)、img、em(强调)、label特点: 和其他元素都在一行上、元素的高度、宽度、行高及顶部和底部边距不可设置、元素的宽度就是它包含的文字或图片的宽度...
Css内容： 常用样式：字体、颜色、背景。。。 字体：大小、颜色、粗细、字体Text-decoration：文本修饰{overline 上 Underline 下 Line-throung 中}Text-indent：缩进字体：Font-family：Font-style：italicFont-size：Font-weight：加粗List-style-type： none（list-style：square url）取消图标Background-image：图片Line-height：设置居中 例30pxCursor：设置鼠标光标形...