css

CSS
-在每个标签上可以设置style属性

-编写css样式
　1）标签的style属性

　2）写在head里面，style标签中写样式
　　-id选择器

　　　　#i1{
　　　　　　background-color: blue;
　　　　　　height: 40px
　　　　}

　　- .名称

　　　　.c1{
　　　　　　background-color: blue;
　　　　　　height: 40px
　　　　}

　　<标签 class="名称"> </标签>

　　-标签选择器

　　　　div{
　　　　　　background-color: blue;
　　　　　　color:white;
　　　　}

　　　　所有div标签内容都被赋予背景和字体颜色

　　-层级选择器（用空格分开）

　　　.c1 .c2 div{

　　　　}

　　-组合选择器（用逗号分开）

　　　　#i1,#i1,div{

　　　　　　}

　　-属性选择器
　　　　对选择到的标签再通过属性再进行一次筛选

　　　　.c1[n="hsj"]{width:500px;height:250px;}

　　　　PS:标签上的style优先，编写顺序，就近原则

　　3）css样式可以写在单独文件中

　　　　<link rel="stylesheet" href="文件名称.css"/>

　　4）注释
　　　　/* */

　　5)边框
　　　　style="border:6px dotted red;" 边框，样式，颜色

　　6）
　　　　height 高度 百分比
　　　　width 宽度 像素，百分比
　　　　text-align:ceter 水平方向居中
　　　　line-height 垂直方向根据标签高度
　　　　color 字体颜色
　　　　font-size 字体大小
　　　　font-weight 字体加粗

　　7）float
　　　　让标签飘起来，块级标签也可以堆叠
　　　　<div style="clear: both;"></div>

　　8）display   属性规定元素应该生成的框的类型。
　　　　display: none;    让标签消失
　　　　display: inline;    默认。此元素会被显示为内联元素，元素前后没有换行符。
　　　　display: block;     此元素将显示为块级元素，此元素前后会带有换行符。
　　　　display: inline-block;
　　　　　　　具有inline,默认自己有多少占多少
　　　　　　　具有block，可以设置高度，宽度，padding，margin

　　　　行内标签：无法设置高度，宽度，padding margin
　　　　块级标签：可以设置高度，宽度，padding margin

　　9）padding margin
　　　　内边距：margin:0 auto   当前div居中
　　　　外边距：padding

　　10）
　　　　opcity: 0.5 透明度
　　　　z-index: 层级顺序
　　　　overflow: hidden：隐藏超出范围的图片,auto：超出范围出现滚动条

　　11）选择鼠标指针浮动在其上的元素，并设置其样式：　

　　a:hover
　　　　{ 
　　　　background-color:yellow;
　　　}

　　12）背景图片

　　　　background-image:url('image/4.gif'); # 默认，div大，图片重复放
　　　　background-repeat: repeat-y;          背景图像将在垂直方向重复。
　　　　background-position-x:                         background-position 属性设置背景图像的起始位置。
　　　　background-position-y:

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有