ShyuDai-优快云博客

原创 CSS——position属性

absolute 生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。父元素必须有relative\absolute才可以fixed 生成绝对定位的元素，相对于浏览器窗口进行定位。元素的位置通过 “left”, “top”, “right” 以及 “bottom” ...

2018-10-15 14:24:21 262

原创 CSS——float浮动属性

float浮动 .div1{ width: 100px; height: 100px; background: red; float: left; } .div2{ width: 300px; height: 300px; ...

2018-10-15 14:13:01 571

原创 CSS——背景(background)和列表(list-style)

背景background-attachment图片滚动条滚动div { width: 300px; height: 2000px; background-image: url(img/a31c4997d0d261be5329cf402f6b7ec1.jpg); background-repeat: no-repeat; /*background-attach...

2018-10-15 14:01:30 728

原创 CSS——display属性

div,span { background-color: #00aaee; border: 1px #666 solid; } div{display: inline;} /*使块级元素变为内联元素就不能设置宽高了,同时也没有上下外边距，但可以设置左右margin*/ span{display: block;} /*使行内元素变成块级元素*/...

2018-10-15 13:47:13 372

原创 CSS——盒子模型(margin\padding\border)

盒模型的宽高p{background-color: #ececec;width: 400px;}/*也可以设置百分比来进行宽度设置，是相对父元素的百分比宽度*/.two{max-width: 300px;}.three{min-width: 250px;}/*高度属性设置同理*/<body> <p>盒子模型宽度width:400px</p> &...

2018-10-15 12:05:30 694

原创 CSS——文字对齐方式

横向对齐方法1：单行块级元素水平居中只用添加text-align即可，如P标签，垂直居中vertical-align只适用于行内元素与单元格，所以设置行高与块高度相同即可text-align: center;方法2：普通的文本居中只要设置text-align即可，但是这个设置了P标签的宽度，则是在该宽度内进行居中，则应该设置margin进行居中 .content p ...

2018-10-15 10:40:51 29219 1

原创 CSS——字体、英文间距、大小写及下划线

字体属性font-weight(设置文字的粗细)font-style（设置文字倾斜加粗）font-variant（设置小型大写字母）font-family（设置字体）字体大小（相对单位）&amp;lt;!DOCTYPE html&amp;gt;&amp;lt;html lang=&quot;en&quot;&amp;gt;&amp;lt;head&a

2018-10-15 10:23:23 3129

原创 CSS——样式使用、基本选择器、权值优先级

样式使用方法/*css行内样式*/<p style="color: red;">css行内样式</p>/*css内部样式*/<style type="text/css"> h1{ color: blue; }</style><body><h1>css内部样式</h1

2018-10-15 10:15:36 417

原创 HTML——表单

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title></head><body><h1 align=&quot

2018-10-15 09:41:48 318

原创 HTML——表格、表格嵌套、表格布局

&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&am

2018-10-14 15:04:04 55217 2

原创 HTML——邮箱发送及文件下载

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <a href=&quo

2018-10-14 14:15:34 1549

原创 HTML——锚链接

&amp;amp;lt;!DOCTYPE html&amp;amp;gt;&amp;amp;lt;html lang=&amp;quot;en&amp;quot;&amp;amp;gt;&amp;amp;lt;head&amp;amp;gt; &amp;amp;lt;meta charset=&amp;quot;UTF-8&amp

2018-10-14 14:02:28 27530 2

原创 HTML——超链接

&amp;amp;amp;lt;!DOCTYPE html&amp;amp;amp;gt; &amp;amp;amp;lt;html lang =&amp;amp;quot;en&amp;amp;quot;&amp;amp;amp;gt; &amp;amp;amp;lt;head&amp;amp;amp;gt; &amp;amp;amp;l

2018-10-14 13:57:49 195

原创 HTML——ul、ol、dl标签

Document 朝辞白帝彩云间千里江陵一日还两岸猿声啼不住轻舟已过万重山朝辞白帝彩云间千里江陵一日还两岸猿声啼不住轻舟已过万重山朝辞白帝彩云间千里江陵一日还两岸猿声啼不住轻舟已过万重山朝辞白帝彩云间千里江陵一日还两岸猿声啼不住轻舟已过万重山 ...

2018-10-14 13:54:21 3001

ShyuDai的博客