HTML5/CSS3
关注
分享
扫一扫
0君权神兽0
这个作者很懒，什么都没留下…
展开
-
块元素和内联元素
常用的块级元素标签：address , center , div , dl , form , h1 , h2 , h3 , h4 , h5 , h6 , menu , ol , p , table , ul , li块级元素的特征：①总是在新行上开始，独占一整行；②不设置width时，撑满一行；③支持所有CSS命令；④可以容纳内联元素和其他块元素。(p标签、h标签、td标签内不允许再...原创 2019-02-15 13:53:54 · 135 阅读 · 0 评论 -
定位（position）
position: relative | absolute | fixed | static | inherit;top/right/bottom/left 定位元素偏移量。相对定位：相对自身进行偏移position:relative;a、不影响元素本身的特性；b、不使元素脱离文档流（元素移动之后原始位置会被保留）；c、如果没有定位偏移量，对元素本身没有任何影响；d、提升层级绝对...原创 2019-02-27 09:38:48 · 126 阅读 · 0 评论 -
a标签和伪类
a标签-超链接链接/下载/锚点<a href="www.baidu.com">百度</a>a标签内的文字默认是有下划线的！伪类添加特殊效果link：未访问链接的颜色visited：已访问链接的颜色hover：鼠标悬停变色active：鼠标按下时链接的颜色a:link{ color:black; } a:hover{ color:red; }...原创 2019-02-27 09:35:39 · 161 阅读 · 0 评论 -
文本属性
文字颜色color: red;文本对齐方式text-align: left | center | right;首行缩进text-indent: 32px;text-indent: 2em; (em：当前字体大小)文本修饰（下划线）text-decoration: underline | none;字母间距（字符与字符之间的距离）letter-spacing:...原创 2019-02-20 19:54:14 · 138 阅读 · 0 评论 -
ul,ol,dl标签
ul-无序列表&amp;lt;h4&amp;gt;一个无序列表：&amp;lt;/h4&amp;gt;&amp;lt;ul&amp;gt; &amp;lt;li&amp;gt;咖啡&amp;lt;/li&amp;gt; &amp;lt;li&amp;gt;茶&amp;lt;/li&a原创 2019-03-04 22:55:04 · 235 阅读 · 0 评论 -
字体
加粗font-weight: bold(加粗) | normal(正常);倾斜font-style: italic(斜体) | normal(正常)字号font-size: 20px(谷歌中默认字号大小是16px)字体font-family: “宋体” | “楷体” | “微软雅黑”行高: 一行所占据的高度（上空隙+文字大小+下空隙）line-height...原创 2019-02-19 20:05:43 · 106 阅读 · 0 评论 -
margin外边距
margin外边距：盒子以外要空出的距离，有多个盒子时相当于盒子与盒子的间距☆1.margin的上下外边距会重叠（上面盒子的margin-bottom和下面盒子的margin-top发生重叠）2.子级的margin-top会传递给父级（给父级加上边框则问题解决）设置100×100的容器width:100px;height:100px;background-color:pink;设...原创 2019-02-19 19:55:34 · 470 阅读 · 0 评论 -
padding内边距
padding内边距：相当于盒子四周围栏的厚度，改变其值会影响整个盒子的大小。（☆背景图片和背景颜色会跟随蔓延）设置100×100的容器width:100px;height:100px;background-color:pink;设置padding内边距的值为100pxpadding:100px;实际情况如下，即背景颜色跟随蔓延padding方向：top | right |...原创 2019-02-19 19:50:28 · 403 阅读 · 0 评论 -
选择器总结
id选择器<style> #box{ width: 100px; height: 100px; background-color: pink; }</style><!-- id选择器 - 用于选择当前页面标识符为XXX的元素（标识符最好唯一） #id名称--><body> <div id="box"><..原创 2019-02-18 15:06:54 · 147 阅读 · 0 评论 -
边框
边框的粗细border-width:10px;边框的样式border-style: solid | dashed | dotted;边框的颜色border-color: red;属性复合border: 10px solid red;边框的方向top bottom left right各方向的属性border-top-width: 10px;border...原创 2019-02-18 14:52:26 · 113 阅读 · 0 评论 -
背景
背景颜色background-color: #ccc;背景图片background-image:url(img/test.jpg); /* 默认状态下，背景会平铺 */设置背景是否平铺background-repeat: no-repeat; | repeat-x; | repeat-y; | repeat;背景定位background-position:10...原创 2019-02-18 14:48:47 · 88 阅读 · 0 评论 -
行间、内部、外部样式表
行间样式表<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <!-- 行间样式：给单独的标签添加样式 --> </head> <body原创 2019-02-18 14:45:11 · 424 阅读 · 0 评论 -
浮动（float）
浮动的定义使元素脱离文档流，按照指定方向发生移动，遇到父级边界或者相邻的浮动元素停下来。（文档流是文档中可显示对象在排列时所占用的位置）浮动的特征1、使块元素在一行显示；2、使内联元素支持宽高；3、默认内容撑开宽度；4、使元素脱离文档流；5、提升层级半层给元素在某个方向上设置浮动：float:left | right | none | inherit;使元素的某个方向上不能...原创 2019-02-27 09:43:49 · 208 阅读 · 0 评论