认识HTML标签、CSS样式、盒模型

HTML标签

HTML代码注释 < !--注释文字 -->
HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息,可以包含文字、图片、视频等。

标签 属性
根标签
头标签
</td> <td>在标签之间的文字内容是网页的标题信息</td> </tr> <tr> <td><script></td> <td>填写javascript相关代码<script src="/static/js/abc.js"></script></td> </tr> <tr> <td><style></td> <td>填写css相关代码</td> </tr> <tr> <td><link></td> <td>标签将css样式文件链接到HTML文件内<link href="base.css" rel="stylesheet" type="text/css" /></td> </tr> <tr> <td><meta></td> <td>meta标签被称为可视区域meta标签,<meta name=”viewport” content=”” /></td> </tr> <tr> <td><body></td> <td>内容标签</td> </tr> <tr> <td><h1></td> <td>标题标签(因为h1标签在网页中比较重要,所以一般h1标签被用在网站名称上。腾讯网站就是这样做的。如:<h1>腾讯网</h1>)</td> </tr> <tr> <td><p></td> <td>段落标签</td> </tr> <tr> <td><em></td> <td>在浏览器中<em> 默认用斜体表示</td> </tr> <tr> <td><strong></td> <td><strong> 用粗体表示</td> </tr> <tr> <td><span></span></td> <td>作用就是为了设置单独的样式用的</td> </tr> <tr> <td><q></q></td> <td><q>标签的真正关键点不是它的默认样式双引号(如果这样我们不如自己在键盘上输入双引号就行了),而是它的语义:引用别人的话。</td> </tr> <tr> <td><blockquote></td> <td>作用也是引用别人的文本。但它是对长文本的引用,如在文章中引入大段某知名作家的文字,这时需要这个标签。浏览器对<blockquote>标签的解析是缩进样式。</td> </tr> <tr> <td><br /></td> <td>需要加回车换行的地方加入<br />,<br />标签作用相当于word文档中的回车。与以前我们学过的标签不一样,<br />标签是一个空标签,没有HTML内容的标签就是空标签,空标签只需要写一个开始标签,这样的标签有<br />、<hr />和<img /></td> </tr> <tr> <td> </td> <td>为你的网页中添加一些空格</td> </tr> <tr> <td><hr /></td> <td>添加水平横线,<hr />标签和<br />标签一样也是一个空标签,所以只有一个开始标签,没有结束标签。</td> </tr> <tr> <td><address></td> <td>可以定义一个地址(比如电子邮件地址)、签名或者文档的作者身份,在浏览器上显示的样式为斜体;</td> </tr> <tr> <td><code></td> <td>当代码为一行代码时,你就可以使用<code>标签了.注:如果是多行代码,可以使用<pre>标签。</td> </tr> <tr> <td><pre></td> <td>为你的网页加入大段代码</td> </tr> <tr> <td><a></td> <td><a href="目标网址" title="鼠标滑过显示的文本">链接显示的文本</a>; 1.只要为文本加入a标签后,文字的颜色就会自动变为蓝色;2.标签在默认情况下,链接的网页是在当前浏览器窗口中打开,有时我们需要在新的浏览器窗口中打开则使用<a href="目标网址" target="_blank">click here!</a>;3.<a>标签还有一个作用是可以链接Email地址,使用mailto能让访问者便捷向网站管理者发送电子邮件,如果mailto后面同时有多个参数的话,第一个参数必须以“?”开头,后面的参数每一个都以“&”分隔;<a href=mailto:yy@163.com&cc=xiaoming@16c.com&bcc=xiaoyu@163.com&subject=主题&body=邮件内容>对此影评有何感想,发送邮件给我</a>、cc:抄送,bcc:密文抄送;</td> </tr> <tr> <td><img></td> <td>标签来插入图片<img src = "myimage.gif" alt = "My Image" title = "My Image" />1、src:标识图像的位置;2、alt:指定图像的描述性文本,当图像不可见时(下载不成功时),可看到该属性指定的文本;3、title:提供在图像可见时对图像的描述(鼠标滑过图片时显示的文本);4、图像可以是GIF,PNG,JPEG格式的图像文件。</td> </tr> <tr> <td><ul><li>我的第一个列表信息</li></ul></td> <td>新闻信息列表,ul-li是没有前后顺序的信息列表。</td> </tr> <tr> <td><ol><li>我的第一个列表信息。</li><li>我的第一个列表信息。</li></ol></td> <td>标签来制作有序列表来展示。</td> </tr> <tr> <td><div></td> <td>在网页制作过程过中,可以把一些独立的逻辑部分划分出来,放在一个<div>标签中,这个<div>标签的作用就相当于一个容器。<div id="版块名称">…</div>增加id属性;</td> </tr> <tr> <td><table></td> <td>创建表格的四个元素:table、tbody、tr、th、td;1、<table>…</table>:整个表格以<table>标记开始、</table>标记结束。2、<tbody>…</tbody>:如果不加<thead><tbody><tfooter> , table表格加载完后才显示。加上这些表格结构, tbody包含行的内容下载完优先显示,不必等待表格结束后在显示,同时如果表格很长,用tbody分段,可以一部分一部分地显示。(通俗理解table 可以按结构一块块的显示,不在等整个表格加载完后显示。)3、<tr>…</tr>:表格的一行,所以有几对tr 表格就有几行。4、<td>…</td>:表格的一个单元格,一行中包含几对<td>...</td>,说明一行中就有几列。5、<th>…</th>:表格的头部的一个单元格,表格表头。6、表格中列的个数,取决于一行中数据单元格的个数。总结:1、table表格在没有添加css样式之前,在浏览器中显示是没有表格线的;2、表头,也就是th标签中的文本默认为粗体并且居中显示。。。。<style type="text/css">table tr td,th{border:1px solid #000;}</style>为它添加边框。。。<table summary="表格简介文本">摘要的内容是不会在浏览器中显示出来的。它的作用是增加表格的可读性(语义化),使搜索引擎更好的读懂表格内容,还可以使屏幕阅读器更好的帮助特殊用户读取表格内容。。。。<caption>标题文本</caption>用以描述表格内容,标题的显示位置:表格上方。</td> </tr> <tr> <td><form></td> <td><form method="传送方式" action="服务器文件">1、type:当type="text"时,输入框为文本输入框;当type="password"时, 输入框为密码输入框。2、name:为文本框命名,以备后台程序ASP 、PHP使用。3、value:为文本输入框设置默认值。(一般起到提示作用)</td> </tr> <tr> <td><label for="male"></td> <td><label for="控件id名称">,注意:标签的 for 属性中的值应当与相关控件的 id 属性值一定要相同。label标签不会向用户呈现任何特殊效果,它的作用是为鼠标用户改进了可用性。如果你在 label 标签内点击文本,就会触发此控件。就是说,当用户单击选中该label标签时,浏览器就会自动将焦点转到和标签相关的表单控件上(就自动选中和该label标签相关连的表单控件上)。</td> </tr> </tbody> </table> <p>target 常见的4个值<br> 1、-blank 在新窗口中打开;<br> 2、-self 在当前窗口打开(默认值);<br> 3、-parent 在父窗口打开;<br> 4、-top 在当前浏览器中打开,且框架会消失。</p> <pre><code><form> <label for="username">用户名:</label> <input type="text" name="username" id="username" value="" /> <label for="pass">密码:</label> <input type="password" name="pass" id="pass" value="" /> <input type="submit" value="确定" name="submit" /> <input type="reset" value="重置" name="reset" /> <textarea rows="行数" cols="列数">在这里输入内容,支持多行文本展示</textarea> <input type="radio/checkbox" value="值" name="名称" checked="checked"/> <label>男</label><input type="radio" value="1" name="gender" /> <label>女</label><input type="radio" value="2" name="gender" /> <label>跑步</label><input type="checkbox" value="1" name="checkbox1" /> <label>打球</label><input type="checkbox" value="2" name="checkbox2" /> <label>登山</label><input type="checkbox" value="3" name="checkbox3" /> 注意:同一组的单选按钮,name 取值一定要一致,比如上面例子为同一个名称“radioLove”,这样同一组的单选按钮才可以起到单选的作用。 <label>爱好:</label> <select> <option value="看书">看书</option> <option value="旅游" selected="selected">旅游</option> <option value="运动">运动</option> <option value="购物">购物</option> </select> </form> <form action="save.php" method="post" > <label>爱好:</label> <select multiple="multiple"> <option value="看书">看书</option> <option value="旅游">旅游</option> <option value="运动">运动</option> <option value="购物">购物</option> </select> </form> 注意:下拉列表也可以进行多选操作,在<select>标签中设置multiple="multiple"属性,就可以实现多选功能,在 windows 操作系统下,进行多选时按下Ctrl键同时进行单击(在 Mac下使用 Command +单击) </code></pre> <h1>CSS样式</h1> <h3>CSS的基本知识</h3> <p>1、CSS全称为“层叠样式表 (Cascading Style Sheets)”,它主要是用于定义HTML内容在浏览器内的显示样式,如文字大小、颜色、字体加粗等。<br> css 样式由选择符和声明组成,而声明又由属性和值组成如:</p> <pre><code>p{ font-size:12px; color:red; } </code></pre> <p>2、就像在Html的注释一样,在CSS中也有注释语句:用/<em>注释语句</em>/来标明(Html中使用 < !--注释语句-->)</p> <h3>CSS的三种样式</h3> <p>*三种样式<br> 1、内联式css样式,直接写在现有的HTML标签中:<br> <code><p style="color:red;font-size:12px">这里文字是红色。</p></code><br> 2、嵌入式css样式,写在当前的文件中,嵌入式css样式必须写在<style></style>之间,并且一般情况下嵌入式css样式写在<head></head>之间。如下代码:</p> <pre><code><style type="text/css"> span{ color:red; } </style> </code></pre> <p>3、外部式css样式,写在单独的一个文件中,这个css样式文件以“.css”为扩展名,在<head>内(不是在<style>标签内)使用<link>标签将css样式文件链接到HTML文件内,如下面代码:<br> <code><link href="base.css" rel="stylesheet" type="text/css" /></code><br> 注意:<br> 1.css样式文件名称以有意义的英文字母命名,如 main.css。<br> 2.rel="stylesheet" type="text/css" 是固定写法不可修改。<br> 3.<link>标签位置一般写在<head>标签之内。</p> <ul> <li>优先级:内联式 > 嵌入式 > 外部式</li> <li>但是嵌入式>外部式有一个前提:嵌入式css样式的位置一定在外部式的后面。</li> <li>总结的优先级是有一个前提:内联式、嵌入式、外部式样式表中css样式是在的相同权值的情况下;</li> <li>下面是权值的规则:<br> 标签的权值为1,类选择符的权值为10,ID选择符的权值最高为100。例如下面的代码:</li> </ul> <pre><code>p{color:red;} /*权值为1*/ p span{color:green;} /*权值为1+1=2*/ .warning{color:white;} /*权值为10*/ p span.warning{color:purple;} /*权值为1+1+10=12*/ #footer .note p{color:yellow;} /*权值为100+10+1=111*/ </code></pre> <p>注意:还有一个权值比较特殊--继承也有权值但很低,有的文献提出它只有0.1,所以可以理解为继承的权值最低。</p> <ul> <li>其实总结来说,就是--就近原则(离被设置元素越近优先级别越高)。</li> <li>注意:!important要写在分号的前面 <code>p{color:red!important;}</code><br> 注意当网页制作者不设置css样式时,浏览器会按照自己的一套样式来显示网页。并且用户也可以在浏览器中设置自己习惯的样式,比如有的用户习惯把字号设置为大一些,使其查看网页的文本更加清楚。这时注意样式优先级为:浏览器默认的样式 < 网页制作者样式 < 用户自己设置的样式,但记住!important优先级样式是个例外,权值高于用户自己设置的样式。</li> </ul> <h3>CSS选择器</h3> <ul> <li>标签选择器<br> 标签选择器其实就是html代码中的标签。如右侧代码编辑器中的<html>、<body>、<h1>、<p>、<img>。例如下面代码:<br> <code>p{font-size:12px;line-height:1.6em;}</code> </li> <li>类选择器<br> .类选器名称{css样式代码;};<br> 类选择器词列表方法为一个元素同时设置多个样式。我们可以为一个元素同时设多个样式,但只可以用类选择器的方法实现,ID选择器是不可以的(不能使用 ID 词列表)。</li> <li>ID选择器<br> ID选择符的前面是井号(#)号,而不是英文圆点(.)。<br> ID选择器只能在文档中使用一次.</li> </ul> <pre><code>#setGreen{ color:green; } </code></pre> <ul> <li>子选择器<br> 子选择器,即大于符号(>),用于选择指定标签元素的第一代子元素。如右侧代码编辑器中的代码:<br> <code>.food>li{border:1px solid red;}</code> </li> <li>包含(后代)选择器<br> 包含选择器,即加入空格,用于选择指定标签元素下的后辈元素。如右侧代码编辑器中的代码:<br> <code>.first span{color:red;}</code><br> 请注意这个选择器与子选择器的区别,子选择器(child selector)仅是指它的直接后代,或者你可以理解为作用于子元素的第一代后代。而后代选择器是作用于所有子后代元素。后代选择器通过空格来进行选择,而子选择器是通过“>”进行选择。</li> <li>全局选择器<br> 通用选择器是功能最强大的选择器,它使用一个(*)号指定,它的作用是匹配html中所有标签元素,如下使用下面代码使用html中任意标签元素字体颜色全部设置为红色:<br> <code>* {color:red;}</code><br> 字符串匹配的属性选择符(^ $ *三种,分别对应开始、结尾、包含)</li> <li>伪类选择符<br> 更有趣的是伪类选择符,为什么叫做伪类选择符,它允许给html不存在的标签(标签的某种状态)设置样式,比如说我们给html中一个标签元素的鼠标滑过的状态来设置字体颜色:<br> <code>a:hover{color:red;}</code><br> 上面一行代码就是为 a 标签鼠标滑过的状态设置字体颜色变红。这样就会使第一段文字内容中的“胆小如鼠”文字加入鼠标滑过字体颜色变为红色特效。<br> 如:就是链接样式,a元素的伪类,4种不同的状态:link、visited、active、hover。)</li> <li>分组选择器<br> 当你想为html中多个标签元素设置同一个样式时,可以使用分组选择符(,),如下代码为右侧代码编辑器中的h1、span标签同时设置字体颜色为红色:<br> <code>h1,span{color:red;}</code> </li> </ul> <h3>CSS属性</h3> <table> <thead> <tr> <th>属性名</th> <th>属性值</th> <th>说明</th> </tr> </thead> <tbody> <tr> <td>color</td> <td>red</td> <td>设置颜色</td> </tr> <tr> <td>font-size</td> <td>12px</td> <td>设置字体大小</td> </tr> <tr> <td>font-weight</td> <td>bold</td> <td>设置字体样式粗体</td> </tr> <tr> <td>font-family</td> <td>Microsoft Yahei</td> <td>设置字体种类</td> </tr> <tr> <td>font-variant</td> <td>small-caps</td> <td>把段落设置为小型大写字母字体</td> </tr> <tr> <td>font-style</td> <td>italic</td> <td>设置字体斜体</td> </tr> <tr> <td>text-decoration</td> <td>underline</td> <td>设置下划线</td> </tr> <tr> <td>text-decoration</td> <td>line-through</td> <td>设置删除线</td> </tr> <tr> <td>text-decoration</td> <td>none</td> <td>给a标签去除下划线</td> </tr> <tr> <td>text-indent</td> <td>2em</td> <td>段落排版--缩进</td> </tr> <tr> <td>text-align</td> <td>center</td> <td>被设置元素为文本、图片等行内元素时,水平居中是通过给父元素设置 text-align:center 来实现的</td> </tr> <tr> <td>vertical-align</td> <td>middle</td> <td>用于竖直居中的属性 vertical-align,在父元素设置此样式时,会对inline-block类型的子元素都有用</td> </tr> <tr> <td>line-height</td> <td>1.5em</td> <td>段落排版--行间距(行高)</td> </tr> <tr> <td>word-spacing</td> <td>50px</td> <td>单词间距设置</td> </tr> <tr> <td>letter-spacing</td> <td>50px</td> <td>设置文字间隔或者字母间隔</td> </tr> <tr> <td>background-color</td> <td>yellow</td> <td>设置背景颜色</td> </tr> <tr> <td>display</td> <td>block inline inline-block table-cell</td> <td>显示为块级元素 行内元素 内联块元素 设置为表格单元显示</td> </tr> <tr> <td>visibility</td> <td>hidden visible</td> <td>display:none是彻底消失,不在文档流中占位,浏览器也不会解析该元素;visibility:hidden是视觉上消失了,可以理解为透明度为0的效果,在文档流中占位,浏览器会解析该元素</td> </tr> <tr> <td>border</td> <td>1px solid red</td> <td>设置它的粗细、样式和颜色(边框三个属性);dashed(虚线)dotted(点线)solid(实线)</td> </tr> <tr> <td>padding</td> <td>20px 10px 15px 30px</td> <td>填充也可分为上、右、下、左(顺时针)</td> </tr> <tr> <td>margin</td> <td>20px 10px 15px 30px</td> <td>边界也是可分为上、右、下、左</td> </tr> <tr> <td>border-bottom</td> <td>1px solid red</td> <td>只为一个方向的边框设置样式</td> </tr> <tr> <td>width</td> <td>200px</td> <td>设置宽度</td> </tr> <tr> <td>height</td> <td>200px</td> <td>设置高度</td> </tr> <tr> <td>box-sizing</td> <td>border-box</td> <td>设置边框、内边框和内容的宽度和高度</td> </tr> <tr> <td>box-sizing</td> <td>content-box</td> <td>给内容设置的 width 和 height(默认属性)</td> </tr> <tr> <td>list-style</td> <td>none</td> <td>去除每个li 前面的点 用 li {list-style: none;}</td> </tr> <tr> <td>border-radius</td> <td>25px</td> <td>把一个盒子四角变弧度</td> </tr> <tr> <td>cursor</td> <td>pointer</td> <td>鼠标移入时变成手状标志</td> </tr> <tr> <td>trstransition</td> <td>width 1s</td> <td>鼠标移入时宽度出现时间是1秒</td> </tr> <tr> <td>opacity</td> <td>0或1</td> <td>规定不透明度。从 0.0 (完全透明)到 1.0(完全不透明)。</td> </tr> <tr> <td>z-index</td> <td>-1</td> <td>z-index 属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。元素可拥有负的 z-index 属性值</td> </tr> </tbody> </table> <h3>元素的分类</h3> <ul> <li>常用的块状元素有:<div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote> 、<form><br> 1.每个块级元素都从新的一行开始,并且其后的元素也另起一行。(真霸道,一个块级元素独占一行)<br> 2.元素的高度、宽度、行高以及顶和底边距都可设置。<br> 3.元素宽度在不设置的情况下,是它本身父容器的100%(和父元素的宽度一致),除非设定一个宽度。</li> <li>常用的内联元素有:<a>、<span>、<br>、<i>、<em>、<strong>、<label>、<q>、<var>、<cite>、<code><br> 1、和其他元素都在一行上;<br> 2、元素的高度、宽度及顶部和底部边距不可设置;<br> 3、元素的宽度就是它包含的文字或图片的宽度,不可改变。</li> <li>常用的内联块状元素有:<img>、<input><br> 1、和其他元素都在一行上;<br> 2、元素的高度、宽度、行高以及顶和底边距都可设置。<br> (两个元素之前有缝隙存在,如果后面跟块级元素,则块级元素会换行显示)</li> </ul> <h1>盒模型</h1> <h3>盒模型</h3> <p>盒模型宽度和高度和我们平常所说的物体的宽度和高度理解是不一样的,css内定义的宽(width)和高(height),指的是填充以里的内容范围。<br> 因此一个元素实际宽度(盒子的宽度)=左边界+左边框+左填充+内容宽度+右填充+右边框+右边界。<br> [图片上传失败...(image-5e35bf-1550823356858)]</p> <h3>CSS布局模型</h3> <ul> <li>弹性布局(Flex)<br> Flex 是 Flexible Box 的缩写,意为"弹性布局",用来为盒状模型提供最大的灵活性,任何一个容器都可以指定为Flex 布局链接:</li> </ul> <pre><code>.box{ display: flex; } </code></pre> <ul> <li>CSS Grid 网格布局教程链接 </li> </ul> <p>网格布局(Grid)是最强大的 CSS 布局方案。<br> 它将网页划分成一个个网格,可以任意组合不同的网格,做出各种各样的布局。以前,只能通过复杂的 CSS 框架达到的效果,现在浏览器内置了。</p> <ul> <li>流动模型(Flow)<br> 流动布局模型具有2个比较典型的特征:<br> 第一点,块状元素都会在所处的包含元素内自上而下按顺序垂直延伸分布,因为在默认状态下,块状元素的宽度都为100%。实际上,块状元素都会以行的形式占据位置。<br> 第二点,在流动模型下,内联元素都会在所处的包含元素内从左到右水平分布显示。(内联元素可不像块状元素这么霸道独占一行)</li> <li>浮动模型 (Float)<br> 块状元素这么霸道都是独占一行,如果现在我们想让两个块状元素并排显示,怎么办呢?不要着急,设置元素浮动就可以实现这一愿望。<br> 任何元素在默认情况下是不能浮动的,但可以用 CSS 定义为浮动,如 div、p、table、img 等元素都可以被定义为浮动。如下代码可以实现两个 div 元素一行显示。</li> </ul> <pre><code>div{ width:200px; height:200px; border:2px red solid; float:left; } <div id="div1"></div> <div id="div2"></div> </code></pre> <p>可以设置 width 和 height 属性也可以在一行显示,元素之前没有缝隙存在并且会脱离图层,如果后面跟块级元素,则块级元素不会换行显示。</p> <ul> <li>层模型(Layer)</li> </ul> <p>0、默认定位(position:static);<br> 块级元素独占一行,行内元素默认排列在一行,也就是说每个元素执行各自的默认属性;<br> 1、绝对定位(position: absolute)<br>  绝对定位是特殊的相对定位;<br>  绝对定位是相对它最近的 已定位(position 不能是默认的 static) 的父级元素进行定位的;<br>  如果它的父级元素都没有定位,那它就相对于浏览器首个窗口进行定位的(浏览器有滚动条,往下拉不算首个窗口);<br> 2、相对定位(position: relative)<br> 相对本身位置进行位移<br> 如:<br> right: 20px 在原来的位置往左移动 20 px;<br> top: 20px 在原来的位置往下移动 20 px;<br> left:20px 在原来的位置往右移动 20 px;<br> bottom: 20px; 在原来的位置往上移动 20 px;</p> <blockquote> <p>注意:本来向右移动现在是向左移动,本来想上移动现在是向下移动</p> </blockquote> <p>3、固定定位(position: fixed)<br> 根据浏览器显示进行定位的,即使窗口有垂直滚动条,也是显示能看到窗口就那么大。</p> <h3>CSS样式设计小技巧</h3> <p>1、水平居中设置-行内元素 text-align:center<br> 2、水平居中设置-定宽块状元素:<br> 满足定宽和块状两个条件的元素是可以通过设置“左右margin”值为“auto”来实现居中的。</p> <pre><code>div{ border:1px solid red;/*为了显示居中效果明显为 div 设置了边框*/ width:200px;/*定宽*/ margin:20px auto;/* margin-left 与 margin-right 设置为 auto */ } </code></pre> <p>3、水平居中总结-不定宽块状元素方法(一)<br> 加入 [table]标签;<br> 为什么选择方法一加入table标签? 是利用table标签的长度自适应性---即不定义其长度也不默认父元素body的长度(table其长度根据其内文本长度决定),因此可以看做一个定宽度块元素,然后再利用定宽度块状居中的margin的方法,使其水平居中。<br> 4、水平居中总结-不定宽块状元素方法(二)<br> 设置 [display: inline] 方法:与第一种类似,显示类型设为行内元素,进行不定宽元素的属性设置;<br> 这种方法相比第一种方法的优势是不用增加无语义标签,但也存在着一些问题:它将块状元素的 display 类型改为 inline,变成了行内元素,所以少了一些功能,比如设定长度值。<br> 第二种方法:改变块级元素的 display 为 inline 类型(设置为 [行内元素],然后使用 <code>text-align:center</code> 来实现居中效果。<br> 5、水平居中总结-不定宽块状元素方法(三)<br> 设置 [position:relative]和 left:50%利用相对定位 的方式,将元素向左偏移 50% ,即达到居中的目的;<br> 方法三:通过给父元素设置 float,然后给父元素设置 position:relative 和 left:50%,子元素设置 position:relative 和 left: -50% 来实现水平居中。<br> 6、垂直居中-父元素高度确定的单行文本<br> <strong>父元素高度确定的单行文本</strong>的竖直居中的方法是通过设置父元素的 height 和 line-height 高度一致来实现的。(height: 该元素的高度,line-height: 顾名思义,行高(行间距),指在文本中,行与行之间的 基线间的距离 )。<br> line-height 与 font-size 的计算值之差,在 CSS 中成为“行间距”。分为两半,分别加到一个文本行内容的顶部和底部。<br> 这种文字行高与块高一致带来了一个弊端:当文字内容的长度大于块的宽时,就有内容脱离了块。<br> 7、垂直居中-父元素高度确定的多行文本(方法一)<br> css 中有一个用于竖直居中的属性 vertical-align,在父元素设置此样式时,会对inline-block类型的子元素都有用。<br> 8、垂直居中-父元素高度确定的多行文本(方法二)<br> display:table-cell;/<em>IE8以上及Chrome、Firefox</em>/<br> vertical-align:middle;/<em>IE8以上及Chrome、Firefox</em>/<br> 9、隐性改变display类型<br> 有一个有趣的现象就是当为元素(不论之前是什么类型元素,display:none 除外)设置以下 2 个句之一:</p> <ol> <li>position : absolute</li> <li>float : left 或 float:right<br> 简单来说,只要html代码中出现以上两句之一,元素的display显示类型就会自动变为以 display:inline-block(块状元素)的方式显示,当然就可以设置元素的 width 和 height 了,且默认宽度不占满父元素。<br> 如下面的代码,小伙伴们都知道 a 标签是 行内元素 ,所以设置它的 width 是 没有效果的,但是设置为 position:absolute 以后,就可以了</li> </ol> </article> </div> </div> </div> <!--PC和WAP自适应版--> <div id="SOHUCS" sid="1648589991107919872"></div> <script type="text/javascript" src="/views/front/js/chanyan.js"></script> <!-- 文章页-底部 动态广告位 --> <div class="youdao-fixed-ad" id="detail_ad_bottom"></div> </div> <div class="col-md-3"> <div class="row" id="ad"> <!-- 文章页-右侧1 动态广告位 --> <div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_1"> </div> </div> <!-- 文章页-右侧2 动态广告位 --> <div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_2"></div> </div> <!-- 文章页-右侧3 动态广告位 --> <div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_3"></div> </div> </div> </div> </div> </div> </div> <div class="container"> <h4 class="pt20 mb15 mt0 border-top">你可能感兴趣的:(认识HTML标签、CSS样式、盒模型)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1950233040592629760.htm" title="2022-10-20" target="_blank">2022-10-20</a> <span class="text-muted">体力劳动者</span> <div>不因感觉稍纵即逝就不加记录。在女儿睡觉后我记下今天的小故事。接手新班级后,今天是第二次收到家长的感谢信(微信)。是我表扬次数最多的两位学生家长致来的感谢,他们明显感受到孩子自信、阳光了不少,写作业由被动变为了主动,家庭氛围也由鸡飞狗跳变成了其乐融融。在被顽皮的学生气得头晕之后,我感到了久违的价值感,责任感甚至使命感,我回复家长这样一句话:我们也需要家长的反馈好让我们的教育工作更有劲头。我也认识到,</div> </li> <li><a href="/article/1950226169030832128.htm" title="2022-04-07" target="_blank">2022-04-07</a> <span class="text-muted">上善若水1979527</span> <div>昨天苏阿姨来给我送普门品!和她一块来的还有另外一个阿姨!我下去拿时!那阿姨说你不是干房产的小赵!帮我租房的!我说你认识我?对啊!你帮我租的房子!我没印象了!我和保红一块!我说我想起来了阿姨!你这运动服一换!小电车一骑!一下年轻十岁我早记不得了!我只记得一九年五一带看了河滨美航还有德胜的好多套房子!你都不当意!你告诉我你每晚拜观音菩萨说快让小赵普萨帮我找套合适的房子吧!我把本子上记得半年内的德胜房源</div> </li> <li><a href="/article/1950215982920298496.htm" title="我最喜欢的公众号" target="_blank">我最喜欢的公众号</a> <span class="text-muted">素颜创始人小云</span> <div>一年多前,也是因为工作的原因。认识了她,她是我七个人物法其一,她在我心里也是很敬佩的一个女孩子。她会讲一些护肤知识,哪些产品好用哪些不好用而他讲解的产品都是我跃跃欲试的。图片发自App她做的每一篇文章都很精美,可以吸引到我从头看到尾,看每一个字都会很珍惜很期待,做事也特别的认真仔细。去年出了一本《活得漂亮》我也看了她的创业故事,很厉害!她的认真及敬业精神我觉得是很难学得来的,现在怀孕3个月了,依然</div> </li> <li><a href="/article/1950208989954371584.htm" title="Selenium 特殊控件操作与 ActionChains 实践详解" target="_blank">Selenium 特殊控件操作与 ActionChains 实践详解</a> <span class="text-muted">小馋喵知识杂货铺</span> <a class="tag" taget="_blank" href="/search/selenium/1.htm">selenium</a><a class="tag" taget="_blank" href="/search/%E6%B5%8B%E8%AF%95%E5%B7%A5%E5%85%B7/1.htm">测试工具</a> <div>1.下拉框单选操作(a)使用SeleniumSelect类(标准HTML标签)Selenium提供了内置的Select类用于操作标准下拉框,这种方式简单且直观。fromselenium.webdriver.support.uiimportSelect#定位下拉框dropdown=Select(driver.find_element("id","dropdown_id"))#通过以下三种方式选择单个</div> </li> <li><a href="/article/1950203883577995264.htm" title="我不想再当知识的搬运工" target="_blank">我不想再当知识的搬运工</a> <span class="text-muted">楚煜楚尧</span> <div>因为学校课题研究的需要,这个暑假我依然需要完成一本书的阅读笔记。我选的是管建刚老师的《习课堂十讲》。这本书,之前我读过,所以重读的时候,感到很亲切,摘抄起来更是非常得心应手。20页,40面,抄了十天,终于在今天大功告成了。这对之前什么事都要一拖再拖的我来说,是破天荒的改变。我发现至从认识小尘老师以后,我的确发生了很大的改变。遇到必须做却总是犹豫不去做的事,我学会了按照小尘老师说的那样,在心里默默数</div> </li> <li><a href="/article/1950200841398972416.htm" title="意识决定行动" target="_blank">意识决定行动</a> <span class="text-muted">eggplant</span> <div>2022年3月24日星期四我们经常说“意识决定行动”。“意识”更完整的表达是“思想意识”,思想意识,“搜狗百科”里解释“是人将大脑存储的知识作用于思考生命存在的各种感受的活动。”比较深奥,简单的说我认为就是对事物的认识程度。“意识决定行动”,对事物认知程度的高低决定个体将以什么样的方式去行动,在意识上觉得事情很重要,就会以相对认真的态度去对待,当意识上觉得这件事情没有很大的价值的时候,就会自然将事</div> </li> <li><a href="/article/1950200541233606656.htm" title="Android 基础知识:Android 应用权限详解" target="_blank">Android 基础知识:Android 应用权限详解</a> <span class="text-muted">流水mpc</span> <a class="tag" taget="_blank" href="/search/android/1.htm">android</a> <div>这篇文章为大家系统的梳理一下Android权限相关的知识,在日常开发中,我们都用过权限,但是对于权限的一些细节我们可能掌握的还不够全面,这篇文章会全面的为大家介绍权限相关的知识。当然,本篇文章依然是参考了Google的官方文档:应用权限。本文目录一、认识Android权限(一)Android系统为什么需要权限?Android系统设置权限的目的是保护Android用户的隐私。对于用户的敏感数据And</div> </li> <li><a href="/article/1950199830693343232.htm" title="中原焦点团队党秀丽分享276天,约练268次,5月29日,周五" target="_blank">中原焦点团队党秀丽分享276天,约练268次,5月29日,周五</a> <span class="text-muted">润物无声dang</span> <div>第十二次课,答疑解惑。1.咨询约练过程中遇到来访者上来就说想处理情绪,可是聊的过程中他又不想具体聊他的情绪怎么产生的,多久了,就是希望用外化技术处理他的情绪,我除了好奇是什么让他希望用外化呢,也用阳谋告诉他,外化前也是需要具体的聊聊这个情绪的,还可以怎么做呢?给他安全感这一块大概怎么做呢?不想具体说有他的道理,聊聊情绪大概是什么事儿?专业的认识,专业度的认可。不带功利心,转介几次的不太好,信任程度</div> </li> <li><a href="/article/1950185315146723328.htm" title="《数字时代的学与教》第三模块共读心得" target="_blank">《数字时代的学与教》第三模块共读心得</a> <span class="text-muted">恭昌</span> <div>第三模块的主题是教法学法,主要用十一讲来阐述,分别是:同侪教学法、创造学习的新状态、讨论对话还是合作、解锁“拼图法”、把握合作学习五要素、TBL团队合作学习法、游戏式小组合作学习法、差异化教学法、从学科课堂开始的“创客教育”、探究式学习法及搭建“教学脚手架”。难度适中,同伴互助,学到知识,成就感强。教师要创造学生学习的新状态,让学生养成矫正性学习的新状态,即认识错误到自我改正错误,形成新的正确认识</div> </li> <li><a href="/article/1950181992104521728.htm" title="《蛤蟆先生去看心理医生》:承担责任2个好处,即促进学习和行动" target="_blank">《蛤蟆先生去看心理医生》:承担责任2个好处,即促进学习和行动</a> <span class="text-muted">王明鹏</span> <div>蛤蟆认识到自我进入成人状态的重大意义,这也是一条没有止境的探索和实践之路,自我成长之路。咨询师苍鹭给出了成人自我状态的解释,那就是承担责任,而且进一步说明担责的2个好处。成年人没有容易的生活,不动声色的冷静之下也在忍受压力,谈笑风生的背后也一样有焦虑,但是人家处理情绪的方式与一般人不同,这个最大不同就是面对、接受,即承担责任。担责带来好处,这个好处反过来又强化了担责的行动,这就是行为学习的解释和应</div> </li> <li><a href="/article/1950179840019722240.htm" title="被岁月淡忘了的纪念日,将变成另外一种形式存在于我们的生活里" target="_blank">被岁月淡忘了的纪念日,将变成另外一种形式存在于我们的生活里</a> <span class="text-muted">我是王小楠</span> <div>我和我的先生是经人介绍认识结婚在,他大我五岁,认识时,两个人都属于大龄青年,于是看着对眼便不再挑剔什么,三个月后我们两个结婚,在北京组建了我们的小家庭,像很多夫妻一样,在最初的那几年里日子也过一穷二白,上班、下班、回家,两个人没有更多的娱乐生活,我们也曾争吵、否认、后悔、到最后的认可,这个过程是感情点滴的积累,直到今天我们不知不觉在岁月里已经牵手走过十余年的时光,庆幸彼此没有被婚姻里的七年之痒和琐</div> </li> <li><a href="/article/1950169790018547712.htm" title="陈萌 中原焦点团队网络初级23期 坚持分享第33天 2020年8月11日" target="_blank">陈萌 中原焦点团队网络初级23期 坚持分享第33天 2020年8月11日</a> <span class="text-muted">萌萌_ac9c</span> <div>焦点解决的十条基本精神:1.不要把力气一直花在“分析问题”或是“探讨问题”的原因上,重点是如何“解决问题”。2.没有一件事情只有负面的意义。3.相信孩子是解决自己问题的专家。4.不要一直追寻难以达到的目标,要找到目前就可以做到的事情。5.小小的改变会带来大大的变化。6.成功的例外经验可以引导我们找到问题解决的方向。7.孩子的自我认识是不断建构的。8.合作是必然的现象。9.如果没有用,就不要固着,做</div> </li> <li><a href="/article/1950152981068443648.htm" title="长安三万里,读懂诗人才能更懂诗" target="_blank">长安三万里,读懂诗人才能更懂诗</a> <span class="text-muted">小妮儿的简生活</span> <div>长安三万里,带我们重新进入古诗的世界。在这个世界里,让我们看到了耳熟人详的诗人们更加立体的一面。读懂诗人才能更懂诗。全国100位语文名师联合推荐的这套《语文书里的大诗人》,带领我们去认识六位“超级大诗人”,看他们有怎样的精彩故事,如何能写出流传千古的名篇。我和哥哥一起背古诗300+天,背了188首古诗。尽管背诗数量不少,但对于诗词背后的故事以及对于诗人的了解并不多。而这套书,能够很好地满足我们除背</div> </li> <li><a href="/article/1950147409032048640.htm" title="《青年领袖演说集训营》林智敏感言: 耐得住寂寞,才能守得住繁华!" target="_blank">《青年领袖演说集训营》林智敏感言: 耐得住寂寞,才能守得住繁华!</a> <span class="text-muted">林智敏</span> <div>大家好呀!我叫林智敏,双木林,智慧的智,敏感的敏。认识我智敏,人人变聪颖!认识我智敏,学习更上瘾!初识奋马在临近期末考试的时候,许久没有联系的高中同学—李静给我发了几条信息,问我对演讲有没有兴趣。她聊到她自己最近报了一个课程,让她收获很多,于是想推荐给我学习。我听到后兴奋不已也感动不已。两年没见的朋友,突然在某一天联系你,她愿意将自己收获到的东西分享给我,与我一同进步与成长。那一刻,我在心里默想,</div> </li> <li><a href="/article/1950144989845581824.htm" title="小米mix3今天在故宫发布" target="_blank">小米mix3今天在故宫发布</a> <span class="text-muted">笛白</span> <div>2016年10月25日,也就是2年前的今天,小米开创性的发布mix系列的第一款手机,率先提出全面屏的概念,随着这一市场需求的崛起,无数手机厂家为解决全面屏的问题创新性的进行专研,从最开始的尽量扩大屏占比,到vivo最新款NEX惊艳式的升降式摄像头方案,到今天mix3采用磁铁滑盖式的创新设计,人类在科技的创新道路上永不止步,想尽千方百计获得手机的最佳体验感。我对小米的好感源于对雷军的逐步认识。从武汉</div> </li> <li><a href="/article/1950144089919909888.htm" title="2019-4-6晨间日记" target="_blank">2019-4-6晨间日记</a> <span class="text-muted">微凉意思</span> <div>今天是什么日子起床:七点半就寝:十一点天气:清朗心情:还好纪念日:无任务清单昨日完成的任务,去地里干活最重要的事:好好陪陪父母改进:急脾气,直性子习惯养成:凡事缓一缓,别着急周目标·完成进度学习·信息·阅读学习新事物,接触新天地,认识新世界健康·饮食·锻炼加强锻炼,控制身材人际·家人·朋友坚守原则,努力向上工作·思考不要一味的考虑别人,委屈自己。年龄越大,越要懂得取悦自己最美好的三件事1.放假2.</div> </li> <li><a href="/article/1950141671740076032.htm" title="自然的大祥和" target="_blank">自然的大祥和</a> <span class="text-muted">32598db751bb</span> <div>尚俊平,焦点网络中级,坚持分享841天,2018年8月11日星期一整个禅坐过程可以简化成三个重点:把你的心带回家,放下,放松。把你的心带回家,意思是通过专注的休习,把心带进安住的境界,其深义是,把你的心转向内在,安息在心性之中,这本身就是最高的禅定。放下就是把心从执著的牢狱中解放出来,因为你认识到一切痛苦,恐惧和挫折,都来自执著心的贪欲,在比较深的层次里,有你越来越了解心性而产生的体悟和信心,可以</div> </li> <li><a href="/article/1950139000853426176.htm" title="19岁女生读《廊桥遗梦》有感" target="_blank">19岁女生读《廊桥遗梦》有感</a> <span class="text-muted">弹吉他的Crystal</span> <div>“我们每个人都生活在各自的过去中,人们会用一分钟的时间去认识一个人,用一小时的时间去喜欢一个人,再用一天的时间去爱上一个人,到最后呢,却要用一辈子的时间去忘记一个人。”这是在电台听到的出自廊桥遗梦的文字,觉得真切而又有深意,于是乎看了这部经典的电影,从刚开始不了解到完全被弹幕带偏开始鄙夷女主到后来关了弹幕跟随女主的内心最后哭成泪人。接着找了原版的小说英文的中文的一口气全看完。对于电影,我甚是喜欢美</div> </li> <li><a href="/article/1950128933777240064.htm" title="每日复盘Day505///让孩子做自己" target="_blank">每日复盘Day505///让孩子做自己</a> <span class="text-muted">明明安安好</span> <div>早起✅5:30完成每天三目标1.声音练习✅2.复盘✅3.家人团聚✅每日复盘我的成功与失败成功,是我们坚持奋斗的动力;成功,也是自信的源泉。有了自信和坚强的理由,一切才会顺风顺水,虚伪和懦弱,才会显得苍白无力,无所适从。我们看到了曙光,才更加坚信努力的意义,让我们的理想更上一个台阶。失败,给了我们反省的机会;失败,也是让我们重新认识自我。因为有了失败的经历,才会更好的把握成功的机遇;因为有了痛苦的经</div> </li> <li><a href="/article/1950126282960334848.htm" title="小白学习mysql" target="_blank">小白学习mysql</a> <span class="text-muted">阿什么名字不会重复呢</span> <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a><a class="tag" taget="_blank" href="/search/%E5%A4%A7%E6%95%B0%E6%8D%AE/1.htm">大数据</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a> <div>推荐自学网站不用下载本地环境带自测头歌https://www.educoder.net✅适合基础小白的MySQL简单实用学习计划总学习时间建议:10~14天,每天1小时左右即可最终目标:掌握基础SQL操作,能完成简单项目需求第1阶段:认识数据库与环境搭建(1~2天)你需要学会:•数据库是什么?SQL是什么?•安装MySQLServer+Navicat(推荐用Navicat可视化工具)✅推荐学习内容</div> </li> <li><a href="/article/1950123702318329856.htm" title="认识你们真好" target="_blank">认识你们真好</a> <span class="text-muted">飞柔</span> <div>相识于的朋友们认识你们真好距离并没有让我们感到陌生每一天的写文看文点赞感动着你我因为懂得让你们暖暖的住在心房孤单时有你们的陪伴心犹如一团火在燃烧是那么烫那么的心安认识你们真好有你们的鼓励支持我愿意变成更好的自己彼岸的守望,是我的感动远程的陪同,是心中的丰盈愿我们共同携手并进最终能遇见更出色的自己图片发自App图片发自App图片发自App图片发自App图片发自App图片发自App</div> </li> <li><a href="/article/1950121161115365376.htm" title="我的“自画像”" target="_blank">我的“自画像”</a> <span class="text-muted">爱妮_a2ce</span> <div>四年五班陈希大家好,我的名字叫陈希,我是一名女生,我有一点点胖,戴着一副眼镜,长着长长的头发,长得一般般。我有时在学校,不怎么和同学玩,比如我的好朋友闫诺找我出去玩,我也不怎么去,我不怎么和同学说话,我刚上学的时候,和我的同学都不认识,所以我们很少和对方说话,我也很少和他们玩,我们的第一课体育,玩得很开心,通过后天的了解,我们就熟悉了,但也很少聊天。我的性格比较内向。我的爱好是音乐,我的爱好是弹吉</div> </li> <li><a href="/article/1950108456342056960.htm" title="第六天作业" target="_blank">第六天作业</a> <span class="text-muted">宇宇妈妈_e088</span> <div>对换框法中的“二者兼得”的理解和认识。二者兼得:无论我面对怎样的情况,无论选择是多么的困难,我都努力的去让更多的可能出现,我要始终去思考,怎样才能够更全面,怎样都会达到我想要的,我要灵活的去做,我要有效的去努力,我要坚持的去付出。如果没有达到我想要的,我要不断去检视我自己,我的思维是否灵活我是否去行动了,我的方法是否有效,我是否够努力,我的行动是否坚持,我是否够付出当您深刻感悟到了“二者兼得”背后</div> </li> <li><a href="/article/1950105770125225984.htm" title="小日子40" target="_blank">小日子40</a> <span class="text-muted">半瓶白醋</span> <div>文|清骨图片是《印度合伙人》的电影剧照,是昨天我一个人跑去电影院看的。天气很冷,我没吃晚饭就跑去看电影。这哪里是看电影,是分明是赌气?是的,我跟赛先生闹别扭了。事情是因为,我准备给赛先生准备生日礼物,我想送给特别的,有纪念意义的礼物,就拿了我们认识这么久的聊天记录,准备做一本书。没想到聊天记录太长了,一个月的聊天记录,我都翻了近一个小时。我就有选择的找,有意义的语句。看着以前他对我说的甜言蜜语,心</div> </li> <li><a href="/article/1950102846212993024.htm" title="是他" target="_blank">是他</a> <span class="text-muted">天思静默</span> <div>第一次见他打球的时候,是在阿里地委党校的球场,那个时候,还不认识他,但觉得自己不会想要抬头主动去看他。想起那个时候,他中场休息,伸手递给我一块菠萝味口香糖,那天风沙比较大,天气比较冷,但大太阳还是在的,我抬头眯着眼睛,从阳光的狭缝里,很不情愿懒洋洋地接过他递给我的口香糖,很不耐烦…在这之前,我只知道他的名字。我是一个爱好篮球的女孩,初次坐飞机来到离家五千多公里外的高寒缺氧但美丽的西藏,并没有带着心</div> </li> <li><a href="/article/1950100184717389824.htm" title="11. HTML 中 DOCTYPE 的作用" target="_blank">11. HTML 中 DOCTYPE 的作用</a> <span class="text-muted">yqcoder</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95-CSS/1.htm">前端面试-CSS</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>总结H5的声明HTML5的DOCTYPE声明HTML5中的声明用于告诉浏览器当前文档使用的是HTML5的文档类型。它必须是文档中的第一行内容(在任何HTML标签之前),以确保浏览器能够正确地解析和渲染页面。DOCTYPE的作用触发标准模式:DOCTYPE声明的主要作用是让浏览器以标准模式(StandardsMode)来解析和渲染页面,而不是以兼容模式(QuirksMode)。兼容性:在没有DOCT</div> </li> <li><a href="/article/1950093414880047104.htm" title="干饭人不懂稻花香" target="_blank">干饭人不懂稻花香</a> <span class="text-muted">湘妹夏小莫</span> <div>今天的这篇文章,是第一张植物名片。用我自己的话来介绍一种与我们的生活息息相关的植物:水稻。成熟的稻谷01再认识水稻我们南方人每天的主要食物,就是大米和米制品,可以说是一天不吃米就心慌。然而,对于这种奉献种子给我们做粮食的植物,我们又了解多少呢?网络词典里是这样解释的:水稻,一年生禾本科植物,单子叶,性喜高温、多湿、短日照。成熟时约1米高。叶子细长,花非常小,大部分自花授粉并结种子,称为稻穗。考古学</div> </li> <li><a href="/article/1950084392047144960.htm" title="2019-07-20" target="_blank">2019-07-20</a> <span class="text-muted">790221206753</span> <div>20190720刘柏文感恩日记1感恩隐闲山庄之行,让我认识了一位好伙伴,并分享了他的带团经验,获益良多2感恩羊皮卷的启示,让我愈来愈懂得包容,不再被情绪所左右3感恩运动圈坚持打卡的伙伴们,让我坚持跑步,并拥有健康的体魄和身形,效果显著4感谢读书会小伙伴们的分享,让我学习到不少新东西5感恩爱的力量,让我的女儿重现往日的活沷6感恩小区的物业保安,让我们的家园安宁、祥和7感谢读过的每一本书,获取的是知识</div> </li> <li><a href="/article/1950077648155766784.htm" title="传销的定义及认定标准,好好研究,免得被人笑掉大牙!" target="_blank">传销的定义及认定标准,好好研究,免得被人笑掉大牙!</a> <span class="text-muted">柯云_0872</span> <div>传销是一种组织性质的犯罪活动,就是专门来诈骗人民的财产,在我们国家传销事件特别的严重,也是法律打击的对象,所以我们对于传销要有一个清楚的认识,以此来避免上当受骗。那么传销的定义及认定标准有哪些?传销的定义传销是指组织者发展人员,通过对被发展人员以其直接或者间接发展的人员数量或者业绩为依据计算和给付报酬,或者要求被发展人员以交纳一定费用为条件取得加入资格等方式获得财富的违法行为。传销的本质是“庞氏骗</div> </li> <li><a href="/article/1950073709876277248.htm" title="随笔•《乡情乡韵》出书花絮【原创】" target="_blank">随笔•《乡情乡韵》出书花絮【原创】</a> <span class="text-muted">逍遥太初</span> <div>记得当时朋友兴高采烈地告诉我说,山人他们在搞免费出书了,并拉我一起参加,还发了相关征文的链接。说实话对此我是半信半疑的,天底下哪有这等好事啊,即使有也轮不到我呀,我才来简信没多久,除了少数几位互相交流学习的文友之外,几乎没有认识的人,更别说什么能够帮助出书的重量级人物了。尽管心里是这么想,但还是抱着试试看的心态,打开链接粗略地看了看相关的征文事宜,并关注了专题,觉得好像蛮煞有介事的。再说乡村题材方</div> </li> <li><a href="/article/17.htm" title="分享100个最新免费的高匿HTTP代理IP" target="_blank">分享100个最新免费的高匿HTTP代理IP</a> <span class="text-muted">mcj8089</span> <a class="tag" taget="_blank" href="/search/%E4%BB%A3%E7%90%86IP/1.htm">代理IP</a><a class="tag" taget="_blank" href="/search/%E4%BB%A3%E7%90%86%E6%9C%8D%E5%8A%A1%E5%99%A8/1.htm">代理服务器</a><a class="tag" taget="_blank" href="/search/%E5%8C%BF%E5%90%8D%E4%BB%A3%E7%90%86/1.htm">匿名代理</a><a class="tag" taget="_blank" href="/search/%E5%85%8D%E8%B4%B9%E4%BB%A3%E7%90%86IP/1.htm">免费代理IP</a><a class="tag" taget="_blank" href="/search/%E6%9C%80%E6%96%B0%E4%BB%A3%E7%90%86IP/1.htm">最新代理IP</a> <div>  推荐两个代理IP网站:   1. 全网代理IP:http://proxy.goubanjia.com/   2. 敲代码免费IP:http://ip.qiaodm.com/     120.198.243.130:80,中国/广东省 58.251.78.71:8088,中国/广东省 183.207.228.22:83,中国/</div> </li> <li><a href="/article/144.htm" title="mysql高级特性之数据分区" target="_blank">mysql高级特性之数据分区</a> <span class="text-muted">annan211</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84/1.htm">数据结构</a><a class="tag" taget="_blank" href="/search/mongodb/1.htm">mongodb</a><a class="tag" taget="_blank" href="/search/%E5%88%86%E5%8C%BA/1.htm">分区</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div> mysql高级特性 1 以存储引擎的角度分析,分区表和物理表没有区别。是按照一定的规则将数据分别存储的逻辑设计。器底层是由多个物理字表组成。 2 分区的原理 分区表由多个相关的底层表实现,这些底层表也是由句柄对象表示,所以我们可以直接访问各个分区。存储引擎管理分区的各个底层 表和管理普通表一样(所有底层表都必须使用相同的存储引擎),分区表的索引只是</div> </li> <li><a href="/article/271.htm" title="JS采用正则表达式简单获取URL地址栏参数" target="_blank">JS采用正则表达式简单获取URL地址栏参数</a> <span class="text-muted">chiangfai</span> <a class="tag" taget="_blank" href="/search/js/1.htm">js</a><a class="tag" taget="_blank" href="/search/%E5%9C%B0%E5%9D%80%E6%A0%8F%E5%8F%82%E6%95%B0%E8%8E%B7%E5%8F%96/1.htm">地址栏参数获取</a> <div>GetUrlParam:function GetUrlParam(param){ var reg = new RegExp("(^|&)"+ param +"=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if(r!=null</div> </li> <li><a href="/article/398.htm" title="怎样将数据表拷贝到powerdesigner (本地数据库表)" target="_blank">怎样将数据表拷贝到powerdesigner (本地数据库表)</a> <span class="text-muted">Array_06</span> <a class="tag" taget="_blank" href="/search/powerDesigner/1.htm">powerDesigner</a> <div>================================================== 1、打开PowerDesigner12,在菜单中按照如下方式进行操作 file->Reverse Engineer->DataBase 点击后,弹出 New Physical Data Model 的对话框 2、在General选项卡中 Model name:模板名字,自</div> </li> <li><a href="/article/525.htm" title="logbackのhelloworld" target="_blank">logbackのhelloworld</a> <span class="text-muted">飞翔的马甲</span> <a class="tag" taget="_blank" href="/search/%E6%97%A5%E5%BF%97/1.htm">日志</a><a class="tag" taget="_blank" href="/search/logback/1.htm">logback</a> <div>一、概述 1.日志是啥? 当我是个逗比的时候我是这么理解的:log.debug()代替了system.out.print(); 当我项目工作时,以为是一堆得.log文件。 这两天项目发布新版本,比较轻松,决定好好地研究下日志以及logback。 传送门1:日志的作用与方法: http://www.infoq.com/cn/articles/why-and-how-log 上面的作</div> </li> <li><a href="/article/652.htm" title="新浪微博爬虫模拟登陆" target="_blank">新浪微博爬虫模拟登陆</a> <span class="text-muted">随意而生</span> <a class="tag" taget="_blank" href="/search/%E6%96%B0%E6%B5%AA%E5%BE%AE%E5%8D%9A/1.htm">新浪微博</a> <div>转载自:http://hi.baidu.com/erliang20088/item/251db4b040b8ce58ba0e1235     近来由于毕设需要,重新修改了新浪微博爬虫废了不少劲,希望下边的总结能够帮助后来的同学们。      现行版的模拟登陆与以前相比,最大的改动在于cookie获取时候的模拟url的请求</div> </li> <li><a href="/article/779.htm" title="synchronized" target="_blank">synchronized</a> <span class="text-muted">香水浓</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/thread/1.htm">thread</a> <div>    Java语言的关键字,可用来给对象和方法或者代码块加锁,当它锁定一个方法或者一个代码块的时候,同一时刻最多只有一个线程执行这段代码。当两个并发线程访问同一个对象object中的这个加锁同步代码块时,一个时间内只能有一个线程得到执行。另一个线程必须等待当前线程执行完这个代码块以后才能执行该代码块。然而,当一个线程访问object的一个加锁代码块时,另一个线程仍然</div> </li> <li><a href="/article/906.htm" title="maven 简单实用教程" target="_blank">maven 简单实用教程</a> <span class="text-muted">AdyZhang</span> <a class="tag" taget="_blank" href="/search/maven/1.htm">maven</a> <div>1. Maven介绍  1.1. 简介 java编写的用于构建系统的自动化工具。目前版本是2.0.9,注意maven2和maven1有很大区别,阅读第三方文档时需要区分版本。 1.2. Maven资源 见官方网站;The 5 minute test,官方简易入门文档;Getting Started Tutorial,官方入门文档;Build Coo</div> </li> <li><a href="/article/1033.htm" title="Android 通过 intent传值获得null" target="_blank">Android 通过 intent传值获得null</a> <span class="text-muted">aijuans</span> <a class="tag" taget="_blank" href="/search/android/1.htm">android</a> <div>我在通过intent 获得传递兑现过的时候报错,空指针,我是getMap方法进行传值,代码如下 1 2 3 4 5 6 7 8 9 public void getMap(View view){            Intent i =</div> </li> <li><a href="/article/1160.htm" title="apache 做代理 报如下错误:The proxy server received an invalid response from an upstream" target="_blank">apache 做代理 报如下错误:The proxy server received an invalid response from an upstream</a> <span class="text-muted">baalwolf</span> <a class="tag" taget="_blank" href="/search/response/1.htm">response</a> <div>网站配置是apache+tomcat,tomcat没有报错,apache报错是: The proxy server received an invalid response from an upstream server. The proxy server could not handle the request GET /. Reason: Error reading fr</div> </li> <li><a href="/article/1287.htm" title="Tomcat6 内存和线程配置" target="_blank">Tomcat6 内存和线程配置</a> <span class="text-muted">BigBird2012</span> <a class="tag" taget="_blank" href="/search/tomcat6/1.htm">tomcat6</a> <div>1、修改启动时内存参数、并指定JVM时区 (在windows server 2008 下时间少了8个小时) 在Tomcat上运行j2ee项目代码时,经常会出现内存溢出的情况,解决办法是在系统参数中增加系统参数:  window下, 在catalina.bat最前面 set JAVA_OPTS=-XX:PermSize=64M -XX:MaxPermSize=128m -Xms5</div> </li> <li><a href="/article/1414.htm" title="Karam与TDD" target="_blank">Karam与TDD</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/Karam/1.htm">Karam</a><a class="tag" taget="_blank" href="/search/TDD/1.htm">TDD</a> <div>一.TDD         测试驱动开发(Test-Driven Development,TDD)是一种敏捷(AGILE)开发方法论,它把开发流程倒转了过来,在进行代码实现之前,首先保证编写测试用例,从而用测试来驱动开发(而不是把测试作为一项验证工具来使用)。         TDD的原则很简单: a.只有当某个</div> </li> <li><a href="/article/1541.htm" title="[Zookeeper学习笔记之七]Zookeeper源代码分析之Zookeeper.States" target="_blank">[Zookeeper学习笔记之七]Zookeeper源代码分析之Zookeeper.States</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/zookeeper/1.htm">zookeeper</a> <div> public enum States { CONNECTING, //Zookeeper服务器不可用,客户端处于尝试链接状态 ASSOCIATING, //??? CONNECTED, //链接建立,可以与Zookeeper服务器正常通信 CONNECTEDREADONLY, //处于只读状态的链接状态,只读模式可以在</div> </li> <li><a href="/article/1668.htm" title="【Scala十四】Scala核心八:闭包" target="_blank">【Scala十四】Scala核心八:闭包</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/scala/1.htm">scala</a> <div>Free variable A free variable of an expression is a variable that’s used inside the expression but not defined inside the expression. For instance, in the function literal expression (x: Int) => (x</div> </li> <li><a href="/article/1795.htm" title="android发送json并解析返回json" target="_blank">android发送json并解析返回json</a> <span class="text-muted">ronin47</span> <a class="tag" taget="_blank" href="/search/android/1.htm">android</a> <div>package com.http.test; import org.apache.http.HttpResponse; import org.apache.http.HttpStatus; import org.apache.http.client.HttpClient; import org.apache.http.client.methods.HttpGet; import </div> </li> <li><a href="/article/1922.htm" title="一份IT实习生的总结" target="_blank">一份IT实习生的总结</a> <span class="text-muted">brotherlamp</span> <a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a><a class="tag" taget="_blank" href="/search/php%E8%B5%84%E6%96%99/1.htm">php资料</a><a class="tag" taget="_blank" href="/search/php%E6%95%99%E7%A8%8B/1.htm">php教程</a><a class="tag" taget="_blank" href="/search/php%E5%9F%B9%E8%AE%AD/1.htm">php培训</a><a class="tag" taget="_blank" href="/search/php%E8%A7%86%E9%A2%91/1.htm">php视频</a> <div>今天突然发现在不知不觉中自己已经实习了 3 个月了,现在可能不算是真正意义上的实习吧,因为现在自己才大三,在这边撸代码的同时还要考虑到学校的功课跟期末考试。让我震惊的是,我完全想不到在这 3 个月里我到底学到了什么,这是一件多么悲催的事情啊。同时我对我应该 get 到什么新技能也很迷茫。所以今晚还是总结下把,让自己在接下来的实习生活有更加明确的方向。最后感谢工作室给我们几个人这个机会让我们提前出来</div> </li> <li><a href="/article/2049.htm" title="据说是2012年10月人人网校招的一道笔试题-给出一个重物重量为X,另外提供的小砝码重量分别为1,3,9。。。3^N。 将重物放到天平左侧,问在两边如何添加砝码" target="_blank">据说是2012年10月人人网校招的一道笔试题-给出一个重物重量为X,另外提供的小砝码重量分别为1,3,9。。。3^N。 将重物放到天平左侧,问在两边如何添加砝码</a> <span class="text-muted">bylijinnan</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div> public class ScalesBalance { /** * 题目: * 给出一个重物重量为X,另外提供的小砝码重量分别为1,3,9。。。3^N。 (假设N无限大,但一种重量的砝码只有一个) * 将重物放到天平左侧,问在两边如何添加砝码使两边平衡 * * 分析: * 三进制 * 我们约定括号表示里面的数是三进制,例如 47=(1202</div> </li> <li><a href="/article/2176.htm" title="dom4j最常用最简单的方法" target="_blank">dom4j最常用最简单的方法</a> <span class="text-muted">chiangfai</span> <a class="tag" taget="_blank" href="/search/dom4j/1.htm">dom4j</a> <div>要使用dom4j读写XML文档,需要先下载dom4j包,dom4j官方网站在 http://www.dom4j.org/目前最新dom4j包下载地址:http://nchc.dl.sourceforge.net/sourceforge/dom4j/dom4j-1.6.1.zip 解开后有两个包,仅操作XML文档的话把dom4j-1.6.1.jar加入工程就可以了,如果需要使用XPath的话还需要</div> </li> <li><a href="/article/2303.htm" title="简单HBase笔记" target="_blank">简单HBase笔记</a> <span class="text-muted">chenchao051</span> <a class="tag" taget="_blank" href="/search/hbase/1.htm">hbase</a> <div> 一、Client-side write buffer 客户端缓存请求 描述:可以缓存客户端的请求,以此来减少RPC的次数,但是缓存只是被存在一个ArrayList中,所以多线程访问时不安全的。 可以使用getWriteBuffer()方法来取得客户端缓存中的数据。 默认关闭。 二、Scan的Caching 描述: next( )方法请求一行就要使用一次RPC,即使</div> </li> <li><a href="/article/2430.htm" title="mysqldump导出时出现when doing LOCK TABLES" target="_blank">mysqldump导出时出现when doing LOCK TABLES</a> <span class="text-muted">daizj</span> <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/mysqdump/1.htm">mysqdump</a><a class="tag" taget="_blank" href="/search/%E5%AF%BC%E6%95%B0%E6%8D%AE/1.htm">导数据</a> <div>  执行 mysqldump -uxxx -pxxx -hxxx -Pxxxx database tablename > tablename.sql  导出表时,会报 mysqldump: Got error: 1044: Access denied for user 'xxx'@'xxx' to database 'xxx' when doing LOCK TABLES 解决</div> </li> <li><a href="/article/2557.htm" title="CSS渲染原理" target="_blank">CSS渲染原理</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a> <div>  从事Web前端开发的人都与CSS打交道很多,有的人也许不知道css是怎么去工作的,写出来的css浏览器是怎么样去解析的呢?当这个成为我们提高css水平的一个瓶颈时,是否应该多了解一下呢?          一、浏览器的发展与CSS           </div> </li> <li><a href="/article/2684.htm" title="《阿甘正传》台词" target="_blank">《阿甘正传》台词</a> <span class="text-muted">dcj3sjt126com</span> <div>Part Ⅰ: 《阿甘正传》Forrest Gump经典中英文对白 Forrest: Hello! My names Forrest. Forrest Gump. You wanna Chocolate? I could eat about a million and a half othese. My momma always said life was like a box ochocol</div> </li> <li><a href="/article/2811.htm" title="Java处理JSON" target="_blank">Java处理JSON</a> <span class="text-muted">dyy_gusi</span> <a class="tag" taget="_blank" href="/search/json/1.htm">json</a> <div>Json在数据传输中很好用,原因是JSON 比 XML 更小、更快,更易解析。 在Java程序中,如何使用处理JSON,现在有很多工具可以处理,比较流行常用的是google的gson和alibaba的fastjson,具体使用如下: 1、读取json然后处理 class ReadJSON { public static void main(String[] args) </div> </li> <li><a href="/article/2938.htm" title="win7下nginx和php的配置" target="_blank">win7下nginx和php的配置</a> <span class="text-muted">geeksun</span> <a class="tag" taget="_blank" href="/search/nginx/1.htm">nginx</a> <div>1.  安装包准备 nginx :  从nginx.org下载nginx-1.8.0.zip php: 从php.net下载php-5.6.10-Win32-VC11-x64.zip, php是免安装文件。 RunHiddenConsole: 用于隐藏命令行窗口   2. 配置 # java用8080端口做应用服务器,nginx反向代理到这个端口即可 p</div> </li> <li><a href="/article/3065.htm" title="基于2.8版本redis配置文件中文解释" target="_blank">基于2.8版本redis配置文件中文解释</a> <span class="text-muted">hongtoushizi</span> <a class="tag" taget="_blank" href="/search/redis/1.htm">redis</a> <div>转载自: http://wangwei007.blog.51cto.com/68019/1548167        在Redis中直接启动redis-server服务时, 采用的是默认的配置文件。采用redis-server   xxx.conf 这样的方式可以按照指定的配置文件来运行Redis服务。下面是Redis2.8.9的配置文</div> </li> <li><a href="/article/3192.htm" title="第五章 常用Lua开发库3-模板渲染" target="_blank">第五章 常用Lua开发库3-模板渲染</a> <span class="text-muted">jinnianshilongnian</span> <a class="tag" taget="_blank" href="/search/nginx/1.htm">nginx</a><a class="tag" taget="_blank" href="/search/lua/1.htm">lua</a> <div>动态web网页开发是Web开发中一个常见的场景,比如像京东商品详情页,其页面逻辑是非常复杂的,需要使用模板技术来实现。而Lua中也有许多模板引擎,如目前我在使用的lua-resty-template,可以渲染很复杂的页面,借助LuaJIT其性能也是可以接受的。   如果学习过JavaEE中的servlet和JSP的话,应该知道JSP模板最终会被翻译成Servlet来执行;而lua-r</div> </li> <li><a href="/article/3319.htm" title="JZSearch大数据搜索引擎" target="_blank">JZSearch大数据搜索引擎</a> <span class="text-muted">颠覆者</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a> <div>系统简介: 大数据的特点有四个层面:第一,数据体量巨大。从TB级别,跃升到PB级别;第二,数据类型繁多。网络日志、视频、图片、地理位置信息等等。第三,价值密度低。以视频为例,连续不间断监控过程中,可能有用的数据仅仅有一两秒。第四,处理速度快。最后这一点也是和传统的数据挖掘技术有着本质的不同。业界将其归纳为4个“V”——Volume,Variety,Value,Velocity。大数据搜索引</div> </li> <li><a href="/article/3446.htm" title="10招让你成为杰出的Java程序员" target="_blank">10招让你成为杰出的Java程序员</a> <span class="text-muted">pda158</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E7%BC%96%E7%A8%8B/1.htm">编程</a><a class="tag" taget="_blank" href="/search/%E6%A1%86%E6%9E%B6/1.htm">框架</a> <div>如果你是一个热衷于技术的  Java 程序员, 那么下面的 10 个要点可以让你在众多 Java 开发人员中脱颖而出。    1. 拥有扎实的基础和深刻理解 OO 原则   对于 Java 程序员,深刻理解 Object Oriented Programming(面向对象编程)这一概念是必须的。没有 OOPS 的坚实基础,就领会不了像 Java 这些面向对象编程语言</div> </li> <li><a href="/article/3573.htm" title="tomcat之oracle连接池配置" target="_blank">tomcat之oracle连接池配置</a> <span class="text-muted">小网客</span> <a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a> <div>tomcat版本7.0 配置oracle连接池方式: 修改tomcat的server.xml配置文件: <GlobalNamingResources> <Resource name="utermdatasource" auth="Container" type="javax.sql.DataSou</div> </li> <li><a href="/article/3700.htm" title="Oracle 分页算法汇总" target="_blank">Oracle 分页算法汇总</a> <span class="text-muted">vipbooks</span> <a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a><a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/.net/1.htm">.net</a> <div>    这是我找到的一些关于Oracle分页的算法,大家那里还有没有其他好的算法没?我们大家一起分享一下! -- Oracle 分页算法一 select * from ( select page.*,rownum rn from (select * from help) page -- 20 = (currentPag</div> </li> </ul> </div> </div> </div> <div> <div class="container"> <div class="indexes"> <strong>按字母分类:</strong> <a href="/tags/A/1.htm" target="_blank">A</a><a href="/tags/B/1.htm" target="_blank">B</a><a href="/tags/C/1.htm" target="_blank">C</a><a href="/tags/D/1.htm" target="_blank">D</a><a href="/tags/E/1.htm" target="_blank">E</a><a href="/tags/F/1.htm" target="_blank">F</a><a href="/tags/G/1.htm" target="_blank">G</a><a href="/tags/H/1.htm" target="_blank">H</a><a href="/tags/I/1.htm" target="_blank">I</a><a href="/tags/J/1.htm" target="_blank">J</a><a href="/tags/K/1.htm" target="_blank">K</a><a href="/tags/L/1.htm" target="_blank">L</a><a href="/tags/M/1.htm" target="_blank">M</a><a href="/tags/N/1.htm" target="_blank">N</a><a href="/tags/O/1.htm" target="_blank">O</a><a href="/tags/P/1.htm" target="_blank">P</a><a href="/tags/Q/1.htm" target="_blank">Q</a><a href="/tags/R/1.htm" target="_blank">R</a><a href="/tags/S/1.htm" target="_blank">S</a><a href="/tags/T/1.htm" target="_blank">T</a><a href="/tags/U/1.htm" target="_blank">U</a><a href="/tags/V/1.htm" target="_blank">V</a><a href="/tags/W/1.htm" target="_blank">W</a><a href="/tags/X/1.htm" target="_blank">X</a><a href="/tags/Y/1.htm" target="_blank">Y</a><a href="/tags/Z/1.htm" target="_blank">Z</a><a href="/tags/0/1.htm" target="_blank">其他</a> </div> </div> </div> <footer id="footer" class="mb30 mt30"> <div class="container"> <div class="footBglm"> <a target="_blank" href="/">首页</a> - <a target="_blank" href="/custom/about.htm">关于我们</a> - <a target="_blank" href="/search/Java/1.htm">站内搜索</a> - <a target="_blank" href="/sitemap.txt">Sitemap</a> - <a target="_blank" href="/custom/delete.htm">侵权投诉</a> </div> <div class="copyright">版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved. <!-- <a href="https://beian.miit.gov.cn/" rel="nofollow" target="_blank">京ICP备09083238号</a><br>--> </div> </div> </footer> <!-- 代码高亮 --> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shCore.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shLegacy.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shAutoloader.js"></script> <link type="text/css" rel="stylesheet" href="/static/syntaxhighlighter/styles/shCoreDefault.css"/> <script type="text/javascript" src="/static/syntaxhighlighter/src/my_start_1.js"></script> </body> </html>