前端技术之_CSS详解第一天

一html部分

略。。。。

二、列表

列表有3种

2.1 无序列表

无序列表，用来表示一个列表的语义，并且每个项目和每个项目之间，是不分先后的。

ul就是英语unordered list，“无序列表”的意思。

li 就是英语list item ， “列表项”的意思。

你会发现，这是我们学习的第一个“组标签”，就是要么不写，要么就要写一组。

  1.     <ul><li>北京</li><li>上海</li><li>广州</li><li>铁岭</li>
  2.     </ul>

也就是说，所以的li不能单独存在，必须包裹在ul里面；反过来说，ul的“儿子”不能是别的东西，只能有li。

下面的是错误的，因为必须用ul包裹：

  1. <li>北京</li>
  2. <li>上海</li>
  3. <li>广州</li>
  4. <li>铁岭</li>

下面的也是错误的，因为ul里面只能有li标签，而不能有别的：

  1. <ul>　　<h3>中国主要城市</h3>　　<li>北京</li>　　<li>上海</li>　　<li>广州</li>　　<li>铁岭</li>
  2. </ul>

浏览器会默认的给无序列表小圆点的“先导符号”

但是，我们这里再次强调，ul的作用，并不是给文字增加小圆点的，而是增加无序列表的“语义”的。

ul标签实际应用场景：

导航条：

ul的儿子，只能是li。但是li是一个容器级标签，li里面什么都能放，比如：

甚至于可以再放一个ul：

  1. 1<ul>
  2. 2        <li>
  3. 3            吃的
  4. 18            <ul>
  5. 19                <li>饼干</li>
  6. 20                <li>面包</li>
  7. 21                <li>
  8. 22                    巧克力
  9. 23                    <ul>
  10. 24                        <li>德芙</li>
  11. 25                        <li>费列罗</li>
  12. 26                    </ul>
  13. 27                </li>
  14. 28            </ul>
  15. 4        </li>
  16. 5        <li>
  17. 6            用的
  18. 7            <ul>
  19. 8                <li>笔记本</li>
  20. 9                <li>圆珠笔</li>
  21. 10            </ul>
  22. 11        </li>
  23. 12        <li>
  24. 13            喝的
  25. 14            <ul>
  26. 15                <li>牛奶</li>
  27. 16                <li>可乐</li>
  28. 17            </ul>
  29. 18        </li>
  30.     </ul>

2.2 有序列表

ordered list  有序列表，用ol表示

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  3. <head>
  4.     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
  5.     <title>Document</title>
  6. </head>
  7. <body>
  8.     <h4>中国歌曲排行榜</h4>
  9.     <ol>
  10.         <li>小苹果</li>
  11.         <li>月亮之上</li>
  12.         <li>最炫民族风</li>
  13.     </ol>
  14. </body>
  15. </html>

也就是说，ol和ul就是语义不一样，怎么使用都是一样的。

ol里面只能有li，li必须被ol包裹。li是容器级。

ol这个东西用的不多，如果想表达顺序，大家一般也用ul：

  1. <ul>
  2.     <li>1. 小苹果</li>
  3.     <li>2. 月亮之上</li>
  4.     <li>3. 最炫民族风</li>
  5. </ul>

2.3定义列表

定义列表也是一个组标签，不过比较复杂，出现了三个标签：

dl表示definition list 定义列表

dt表示definition title 定义标题

dd表示definition description 定义表述词儿

dt、dd只能在dl里面；dl里面只能有dt、dd

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  3. <head>
  4.     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
  5.     <title>Document</title>
  6. </head>
  7. <body>
  8.     <h3>中国主要城市</h3>
  9.     <dl>
  10.         <dt>北京</dt>
  11.         <dd>国家首都，政治文化中心</dd>
  12.         <dd>污染很严重，PM2.0天天报表</dd>
  13.     </dl>
  14.  
  15.     <dl>
  16.         <dt>上海</dt>
  17.         <dd>魔都，有外滩、东方明珠塔、黄浦江</dd>
  18.     </dl>
  19.  
  20.     <dl>
  21.         <dt>广州</dt>
  22.         <dd>中国南大门，有珠江、小蛮腰</dd>
  23.     </dl>
  24. </body>
  25. </html>

表达的语义是两层：

1) 是一个列表，列出了北京、上海、广州三个项目

2）每一个词儿都有自己的描述项。

dd是描述dt的。

dt、dd都是容器级标签，想放什么都可以。所以，现在就应该更加清晰的知道：

用什么标签，不是根据样子来决定，而是语义。

三、div和span

div和span是非常重要的标签，div的语义是division“分割”； span的语义就是span“范围、跨度”。

这两个东西，都是最最重要的“盒子”。

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  3. <head>
  4.     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
  5.     <title>Document</title>
  6. </head>
  7. <body>
  8.     <div>
  9.         <h3>中国主要城市</h3>
  10.         <ul>
  11.             <li>北京</li>
  12.             <li>上海</li>
  13.             <li>广州</li>
  14.         </ul>
  15.     </div>
  16.  
  17.     <div>
  18.         <h3>美国主要城市</h3>
  19.         <ul>
  20.             <li>纽约</li>
  21.             <li>洛杉矶</li>
  22.             <li>华盛顿</li>
  23.             <li>西雅图</li>
  24.         </ul>
  25.     </div>
  26. </body>
  27. </html>

div在浏览器中，默认是不会增加任何的效果改变的，但是语义变了，div中的所有元素是一个小区域。

div标签是一个容器级标签，里面什么都能放，甚至可以放div自己

span也是表达“小区域、小跨度”的标签，但是是一个“文本级”的标签。

就是说，span里面只能放置文字、图片、表单元素。 span里面不能放p、h、ul、dl、ol、div。

span里面是放置小元素的，div里面放置大东西的：

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  3. <head>
  4.     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
  5.     <title>Document</title>
  6.     <style type="text/css">
  7.         span{
  8.             background-color: pink;
  9.         }
  10.     </style>
  11. </head>
  12. <body>
  13.     <h3>书</h3>
  14.     <ul>
  15.         <li>
  16.             <p>书名</p>
  17.             <p>
  18.                 简介简介简介简介简介简介简介简介
  19.                 <span>
  20.                     <a href="">详细信息</a>
  21.                     <a href="">购买</a>
  22.                 </span>
  23.             </p>
  24.         </li>
  25.         <li>
  26.             <p>书名</p>
  27.             <p>
  28.                 简介简介简介简介简介简介简介简介
  29.                 <span>
  30.                     <a href="">详细信息</a>
  31.                     <a href="">购买</a>
  32.                 </span>
  33.             </p>
  34.         </li>
  35.         <li>
  36.             <p>书名</p>
  37.             <p>
  38.                 简介简介简介简介简介简介简介简介
  39.                 <span>
  40.                     <a href="">详细信息</a>
  41.                     <a href="">购买</a>
  42.                 </span>
  43.             </p>
  44.         </li>
  45.     </ul>
  46. </body>
  47. </html>

div标签是最最重要的布局标签

  1. 1    <div class="header">
  2. 2        <div class="logo"></div>
  3. 3        <div class="nav"></div>
  4. 4    </div>
  5. 5    <div class="content">
  6. 6        <div class="guanggao"></div>
  7. 7        <div class="dongxi"></div>
  8. 8    </div>
  9.     <div class="footer"></div>

所以，我们亲切的称呼这种模式叫做“div+css”。div标签负责布局，负责结构，负责分块。css负责样式。

案例：

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  3. <head>
  4.     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
  5.     <title>Document</title>
  6.     <style type="text/css">
  7.         .header{
  8.             width: 980px;
  9.             height:100px;
  10.             margin: 0 auto;
  11.  
  12.             margin-bottom: 10px;
  13.         }
  14.         .content{
  15.             width: 980px;
  16.             height: 400px;
  17.  
  18.             margin: 0 auto;
  19.             margin-bottom: 10px;
  20.         }
  21.         .footer{
  22.             width: 980px;
  23.             height:100px;
  24.             margin: 0 auto;
  25.             background-color: yellow;
  26.             margin-bottom: 10px;
  27.         }
  28.         .logo{
  29.             float: left;
  30.             width: 200px;
  31.             height: 60px;
  32.             background-color: red;
  33.         }
  34.         .nav{
  35.             float: right;
  36.             width: 600px;
  37.             height: 60px;
  38.             background-color: blue;
  39.         }
  40.         .guanggao{
  41.             float: left;
  42.             width: 250px;
  43.             height: 400px;
  44.             background-color: darkblue;
  45.         }
  46.         .dongxi{
  47.             float: right;
  48.             width: 690px;
  49.             height: 400px;
  50.             background-color: skyblue;
  51.         }
  52.     </style>
  53. </head>
  54. <body>
  55.     <div class="header">
  56.         <div class="logo">这就是logo</div>
  57.         <div class="nav">导航条</div>
  58.     </div>
  59.     <div class="content">
  60.         <div class="guanggao">广告</div>
  61.         <div class="dongxi">卖的东西</div>
  62.     </div>
  63.     <div class="footer">页脚</div>
  64. </body>
  65. </html>

四、表单

表单就是收集用户信息的，就是让用户填写的、选择的。

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  3. <head>
  4.     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
  5.     <title>Document</title>
  6. </head>
  7. <body>
  8.     <div>
  9.         <h3>欢迎注册本网站</h3>
  10.         <form action="1.php">
  11.             <p>
  12.                 请输入您的姓名:
  13.                 <input type="text" value="默认有的值，(*^__^*) 嘻嘻……" />
  14.             </p>
  15.             <p>
  16.                 请输入您的密码：
  17.                 <input type="password" />
  18.             </p>
  19.             <p>
  20.                 请选择你的性别：
  21.                 <input type="radio" name="xingbie" /> 男
  22.                 <input type="radio" name="xingbie" /> 女
  23.                 <input type="radio" name="xingbie" /> 保密
  24.             </p>
  25.             <p>
  26.                 请选择你的学历：
  27.                 <input type="radio" name="xueli" /> 幼儿园
  28.                 <input type="radio" name="xueli" /> 小学
  29.                 <input type="radio" name="xueli" /> 初中
  30.                 <input type="radio" name="xueli" /> 高中
  31.                 <input type="radio" name="xueli" /> 大学
  32.                 <input type="radio" name="xueli" /> 硕士
  33.                 <input type="radio" name="xueli" /> 博士
  34.                 <input type="radio" name="xueli" /> 更高
  35.             </p>
  36.             <p>
  37.                 请选择你的爱好：
  38.                 <input type="checkbox" name="aihao"/> 睡觉
  39.                 <input type="checkbox" name="aihao"/> 吃饭
  40.                 <input type="checkbox" name="aihao"/> 足球
  41.                 <input type="checkbox" name="aihao"/> 篮球
  42.                 <input type="checkbox" name="aihao"/> 乒乓球
  43.                 <input type="checkbox" name="aihao"/> 打豆豆
  44.             </p>
  45.             <p>
  46.                 请选择你的技能：
  47.                 <input type="checkbox" name="jineng" /> HTML
  48.                 <input type="checkbox" name="jineng" /> CSS
  49.                 <input type="checkbox" name="jineng" /> JS
  50.             </p>
  51.             <p>
  52.                 请选择你的籍贯：
  53.                 <select>
  54.                     <option>北京</option>
  55.                     <option>河北</option>
  56.                     <option>河南</option>
  57.                     <option>山东</option>
  58.                     <option>山西</option>
  59.                     <option>湖北</option>
  60.                     <option>安徽</option>
  61.                 </select>
  62.             </p>
  63.             <p>
  64.                 签名：
  65.                 <textarea rows="4" cols="80"></textarea>
  66.             </p>
  67.             <p>
  68.                 普通按钮：
  69.                 <input type="button" value="我是一个普通按钮" />
  70.             </p>
  71.             <p>
  72.                 提交按钮：
  73.                 <input type="submit" />
  74.             </p>
  75.             <p>
  76.                 重置按钮
  77.                 <input type="reset" />
  78.             </p>
  79.         </form>
  80.     </div>
  81. </body>
  82. </html>

form是英语表单的意思。form标签里面有action属性和method属性，稍微说一下：action属性就是表示，表单将提交到哪里。 method属性表示用什么HTTP方法提交，有get、post两种。

4.1 文本框

  1. <input type="text" />

input表示“输入”，指的是这是一个“输入小部件”，

type表示“类型”，

text表示“文本”，指的是类型是一个文本框的输入小部件。

这是一个自封闭标签，自此，自封闭标签有：

  1. <meta name=”Keywords” content=”” />
  2. <img src=”” alt=”” />
  3. <input type=”text” />
  1. value表示“值”，value属性就是默认有的值，文本框中已经被填写好了：
  1. <input type="text" value="默认有的值" />

4.2 密码框

  1. <input type="password" />

到底是啥？看type属性的值是什么，来决定。也就是说，input标签很神奇，又是文本框，又是密码框。

如果type=”text”  文本框

如果type=”password” 密码框

4.3 单选按钮

只能选一个，术语叫做“互斥”。

  1. <input type="radio" name="xingbie" /> 男
  2. <input type="radio" name="xingbie" /> 女

非常像以前的收音机，按下去一个按钮，其他的就抬起来了。所以叫做radio。radio是“收音机”的意思，input的type的值，如果是radio就是单选按钮。

  1. 1 <input type="radio" name="xingbie" /> 男
  2. 2 <input type="radio" name="xingbie" /> 女

单选按钮，天生是不能互斥的，如果想互斥，必须要有相同的name属性。name就是“名字”。

  1. 1 <input type="radio" name="sex" checked="checked">

默认被选择，就应该书写checked=”checked”

<input type="radio" name="sex" checked="checked">

4.4 复选框

也是input标签，type是checkbox。

  1. 1 <p>
  2. 2  请选择你的爱好：
  3. 3  <input type="checkbox" name="aihao"/> 睡觉
  4. 4  <input type="checkbox" name="aihao"/> 吃饭
  5. 5  <input type="checkbox" name="aihao"/> 足球
  6. 6  <input type="checkbox" name="aihao"/> 篮球
  7. 7  <input type="checkbox" name="aihao"/> 乒乓球
  8. 8  <input type="checkbox" name="aihao"/> 打豆豆
  9. 9 </p>

复选框，最好也是有相同的name（虽然他不需要互斥，但是也要有相同的name）

HTML5中，input的类型又增加了很多（比如date、color，但是都不兼容，所以我们是在专门的HTML5课程中学）。

不过现在，我们就先学习这四个。

  1. 1 <input type="text" /> 文本框
  2. 2 <input type="password" /> 密码框
  3. 1 <input type="radio"> 单选按钮
  4. 2 <input type="checkbox" /> 复选框

4.5 下拉列表

select就是“选择”，option“选项”。

select标签和ul、ol、dl一样，都是组标签。

  1. 1 <select>
  2. 2  <option>北京</option>
  3. 3  <option>河北</option>
  4. 4  <option>河南</option>
  5. 5  <option>山东</option>
  6. 6  <option>山西</option>
  7. 7  <option>湖北</option>
  8. 8  <option>安徽</option>
  9. 9 </select>

4.6 多行文本框（文本域）

text就是“文本”，area就是“区域”。

1 <textarea cols="30" rows="10"></textarea>

这个标签，是个标签对儿。对儿里面不用写东西。如果写的话，就是这个框的默认文字。

cols属性表示columns“列”，rows属性表示rows“行”。

值就是一个数，表示多少行，多少列。

4.7 三种按钮

按钮也是input标签，一共有三种按钮：

普通按钮：

  1.  <input type="button" value="我是一个普通按钮" />

button就是英语“按钮”的意思。value就是“值”的意思，按钮上面显示的文字。

提交按钮：

 1 <input type="submit" /> 

这个按钮点击，表单真的能提交。这个表单就会被提交到，form标签的action属性中的那个页面中去。submit就是英语“提交”的意思。这个按钮不需要写value自动就有“提交”文字。

4.8 label标签

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  3. <head>
  4.     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
  5.     <title>Document</title>
  6. </head>
  7. <body>
  8.     <p>
  9.         请选择你的性别：
  10.         <input type="radio" name="sex" id="nan" /> <label for="nan">男</label>
  11.         <input type="radio" name="sex" id="nv"  /> <label for="nv">女</label>
  12.     </p>
  13.     <p>
  14.         <input type="checkbox" id="kk" />
  15.         <label for="kk">10天内免登陆</label>
  16.     </p>
  17.     <p>
  18.         <label for="xingming">姓名：</label>
  19.         <input type="text" id="xingming" />
  20.     </p>
  21. </body>
  22. </html>

五、HTML杂项

5.1 HTML注释

任何的程序、代码都有注释，注释就是给程序员看的，不影响程序的。

适当的注释，能够让我们的程序更加可读，所以用中文提示自己，这里的程序是干什么的。

  1. 1  <!--这里是头部，还没有做完，准备加两天班弄完-->
  2. 2  <div>头部</div>
  3. 3  <!--这里是陈伟弄的，跟我没关系-->
  4. 4  <div>主要内容</div>
  5. 5  <!--这里是高俊负责的-->
  6. 6  <div>页尾</div>

Sublime中按ctrl+/ 就是注释HTML注释的语法

5.2 字符实体

我们想在页面上输出“<h1>”这些字符，但是HTML认为这是一个标签，还没封闭。

就是<的字符实体，什么意思呢？就是用常用字符表示这些符号的方式。所以，

lt 就是英语less than 小于的意思；

gt就是greater than 大于的意思。就是>的字符实体。

就是©  版权符号。

nbsp就是英语non-breaking spacing不打断空格的意思，就是空格。

所以：

空出了4个字的格，可以防止空白折叠现象。

5.3 HTML废弃标签介绍

HTML现在只负责语义，而不负责样式。但是HTML一开始，连样式也包办了。

这些样式的标签，都已经被废弃。

2004年之前的东西了：

  1. 1 <font size="9" color="red">哈哈</font>

这些标签都是css钩子，而不是原意：

  1. 1     <b>加粗</b>
  2. 2     <u>下划线</u>
  3. 3     <i>倾斜</i>
  4. 4     <del>删除线</del>
  5. 5     <em>强调</em>
  6. 6     <strong>强调</strong>

这些标签，是有着浓厚的样式的作用，干涉了css的作用，所以HTML抛弃了他们。

水平线：

  1. 1 <hr />

换行：

  1. 1 <br />
  1. 1     <p>
  2.  
  3. 2     哈<br />哈哈
  4.  
  5. 3     </p>

网页中99.9999%需要换行的时候，是因为另起了一个段落，所以要用p，不要用<br />不另起一个段落，进行换行。

br是英语break打断的意思。

标准的div+css页面，用的标签种类很少：

  1. 1 div  p  h1  span   a   img   ul   ol    dl    input

HTML结构、字符集。知道每个标签的特殊用法、属性。比如a标签，img的属性。

网络的基础知识。

六、CSS

现在的互联网前端三层：

　　HTML 超文本标记语言 从语义的角度描述页面结构。

　　CSS 层叠式样式表 从审美的角度负责页面样式。

　　JS JavaScript 从交互的角度描述页面行为。

6.1 CSS整体感知

css是cascading style sheet 层叠式样式表的简写。“层叠式”的意思，我们将慢慢的去理解。

css的最新版本是css3，我们学习的是css2.1。 因为css3和css2.1不矛盾，必须先学2.1然后学3。

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  3. <head>
  4.     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
  5.     <title>Document</title>
  6.     <style type="text/css">
  7.         p{
  8.             color:red;
  9.             font-size: 30px;
  10.             text-decoration: underline;
  11.             font-weight: bold;
  12.             text-align: center;
  13.             font-style: italic;
  14.         }
  15.         h1{
  16.             color:blue;
  17.             font-size: 50px;
  18.             font-weight: bold;
  19.             background-color: pink;
  20.         }
  21.     </style>
  22. </head>
  23. <body>
  24.     <h1>我是一个主标题</h1>
  25.     <p>我是一个段落</p>
  26.     <p>我是一个段落</p>
  27. </body>
  28. </html>

css对换行不敏感，对空格也不敏感。但是一定要有标准的语法。冒号，分号都不能省略。

语法：

  1. 1 选择器{
  2. 2  k:v;
  3. 3  k:v;
  4. 4  k:v;
  5. 5  k:v;
  6. 6 }

七、基础选择器

注意的是：

1） 所有的标签，都可以是选择器。比如ul、li、label、dt、dl、input

2） 无论这个标签藏的多深，一定能够被选择上：

3）选择的所有，而不是一个。

7.1 id选择器

  1. 1  <p>我是段落1</p>
  2. 2  <p id="para2">我是段落2</p>
  3. 3  <p>我是段落3</p>

 css：

  1. 1  <style type="text/css">
  2. 2  #para2{
  3. 3  color:red;
  4. 4  }
  5. 5  </style>

id选择器的选择符是“#”。

任何的HTML标签都可以有id属性。表示这个标签的名字。

这个标签的名字，可以任取，但是：

　　1） 只能有字母、数字、下划线

　　2） 必须以字母开头

　　3） 不能和标签同名。比如id不能叫做body、img、a

来自某培训机构的笔记。

前端技术之_CSS详解第一天的更多相关文章

  1. 前端技术之_CSS详解第二天

    前端技术之_CSS详解第二天 1.css基础选择器 html负责结构,css负责样式,js负责行为. css写在head标签里面,容器style标签. 先写选择器,然后写大括号,大括号里面是样式. & ...

  2. 前端技术之_CSS详解第三天

    前端技术之_CSS详解第三天 二.权重问题深入 2.1 同一个标签,携带了多个类名,有冲突: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 ...

  3. 前端技术之_CSS详解第四天

    前端技术之_CSS详解第四天 一.第三天的小总结 盒模型box model,什么是盒子? 所有的标签都是盒子.无论是div.span.a都是盒子.图片.表单元素一律看做文本. 盒模型有哪些组成: wi ...

  4. 前端技术之_CSS详解第五天

    前端技术之_CSS详解第五天 一.行高和字号 1.1 行高 CSS中,所有的行,都有行高.盒模型的padding,绝对不是直接作用在文字上的,而是作用在“行”上的. <!DOCTYPE html ...

  5. 前端技术之_CSS详解第六天--完结

    前端技术之_CSS详解第六天--完结 一.复习第五天的知识 a标签的伪类4个: a:link 没有被点击过的链接 a:visited 访问过的链接 a:hover 悬停 a:active 按下鼠标不松 ...

  6. Cisco路由技术基础知识详解

    第一部分 请写出568A的线序(接触网络第一天就应该会的,只要你掐过,想都能想出来) .网卡MAC地址长度是(  )个二进制位(16进制与2进制的换算关系,只是换种方式问,不用你拿笔去算) A.12  ...

  7. IIS负载均衡-Application Request Route详解第一篇： ARR介绍（转载）

    IIS负载均衡-Application Request Route详解第一篇: ARR介绍 说到负载均衡,相信大家已经不再陌生了,本系列主要介绍在IIS中可以采用的负载均衡的软件:微软的Applica ...

  8. PE文件格式详解,第一讲,DOS头文件格式

    PE文件格式详解,第一讲,DOS头文件格式 今天讲解PE文件格式的DOS头文件格式 首先我们要理解,什么是文件格式,我们常说的EXE可执行程序,就是一个文件格式,那么我们要了解它里面到底存了什么内容 ...

  9. IIS负载均衡-Application Request Route详解第一篇： ARR介绍

    IIS负载均衡-Application Request Route详解第一篇: ARR介绍 说到负载均衡,相信大家已经不再陌生了,本系列主要介绍在IIS中可以采用的负载均衡的软件:微软的Applica ...

随机推荐

  1. spark2.1：flatMap的用法

    代码示例: val sample_data_combine_result=List( (0,(List(FitModel(4022,1447.92,-8.38983306721434,2.0)),1) ...

  2. 初学Java Web(7)——文件的上传和下载

    文件上传 文件上传前的准备 在表单中必须有一个上传的控件 <input type="file" name="testImg"/> 因为 GET 方式 ...

  3. asp.net core 三 Nuget包管理

        参考连接:http://www.cnblogs.com/netcore2/p/7412891.html     这里的说明,基本就是学习了别人的文章,自己做了个备份     asp.net c ...

  4. css befroe after 尾类技术器

    CSS counter计数器(content目录序号自动递增)详解 这篇文章发布于 2014年08月26日,星期二,15:54,归类于 css相关. 阅读 44148 次, 今日 11 次 by zh ...

  5. [LeetCode] Array Nesting 数组嵌套

    A zero-indexed array A consisting of N different integers is given. The array contains all integers ...

  6. python 连接sqlite及操作

    import sqlite3 #查询 def load(table): #连接数据库 con = sqlite3.connect("E:/Datebase/SQLiteStudio/Park ...

  7. 用C# (.NET Core) 实现迭代器设计模式

    本文的概念来自深入浅出设计模式一书 项目需求 有两个饭店合并了, 它们各自有自己的菜单. 饭店合并之后要保留这两份菜单. 这两个菜单是这样的: 菜单项MenuItem的代码是这样的: 最初我们是这样设 ...

  8. snmp爆破(python脚本)

    snmp用来获取信息,然后利用获取的信息来进一步的渗透. 命令行有 snmpwalk -v 2c -c public ip system -c是密码,默认的密码是public 利用工具可以找windo ...

  9. 使用Nwjs开发桌面应用体验

    之前一直用.net开发桌面应用,最近由于公司需要转为nodejs,但也是一直用nodejs开发后台应用,网站,接口等.近期,需要开发一个客户端,想着既然nodejs号称全栈,就试一下开发桌面应用到底行 ...

  10. ●CodeForce 293E Close Vertices

    题链: http://codeforces.com/contest/293/problem/E题解: 点分治,树状数组 大致思路和 POJ 1741 那道点分治入门题相同, 只是因为多了一个路径的边数 ...