抽空再把CSS整理一篇出来

[@more@]

与段落控制相关的标签
段

属性align表示段的对齐方式
回行

水平线

与文本显示相关的标签
文本居中

文档标题
字体属性
粗体
斜体
空格实体引用
　　　　　
注释
列表
带数字编号的列表
(ol创建列表 li列表项)
在ol中用属性start设置开始的数字编号
在li中有属性value设置列表内编号顺序
使用type属性指定编号系统的类型 A a(abcd... ) I i(i ii iii....) 1(1234...)

带有项目符号的列表
<>
使用type属性指定编号系统的类型 circle空心圆圈,disc实心圆圈,square实心方块
无符号的列表

无符号缩进列表

术语列表:
术语
说明
表格：标题表行表头单元格
显示数据页面布局位置控制
表格定义：元素

添加新行
标题
表头
单元格

<br />

2004年成绩单
姓名
语文数学
李四 97
93
李三 90
83

表单：
元素创建 .....

元素
type:text, submit,reset,password,radio,checkbox,hidden
name名称不显示便于取数据
size宽度 value初始值
隐藏控件:用于收集信息传回服务器
列表框
多行文本控件...

超链接:...
嵌入图象:
第一章组织结构
lang dir
background bgcolor text link vlink alink onload onunload

align noshade size width
提供有关文档信息http-equiv name content scheme
通过定义文本之间的间隔组织文档结构
</p><p>第二章文本短语和段落<br /><acronym> 用来定义一个同义词<br /><address> 为作者或交流信息定一个以特定的格式<br /><blockquote> 用来显示大段的引用文字<br /><br> 强迫一行文本断开<br /><cite> 举一个例子<br /><code> 标识显示时的代码碎片<br /><del> 显示因最近一次修改而被删除的文本内容<br /><dfn> 定义一个被封闭的词<br /><em> 强调某些文本<br /><ins> 显示因最近一次修改而插入到文档中的文本<br /><kbd> 指明用户应该输入的文本<br /><p> 定义一个段落<br /><pre> 显示预先被格式化的文本<br /><q> 用来显示短小的引用语<br /><samp> 标识例子的输出结果<br /><strong> 比em更加强调文本<br /><sub> 创建下标<br /><sup> 创建上标<br /><var> 说明一个变量<br /> <br /> 第三章文本格式元素<br /> <b> 使文本以粗体显示<br /> <basefont> 设置基本的文本字体大小<br /> <big> 显示大型文本<br /> <font> 改变字体大小和颜色<br /> <i> 使文本以斜体显示<br /> <s> 给文本加上删除线<br /> <small> 使用小号尺寸的文本<br /> <strike> 给文本加上删除线<br /> <tt> <br /> <u> 给文本加上下划线</p><p>第四章列表<br /><dd> 明确描述用在DL元素中的内容<br /><dir> 创建一个多列的目录列表<br /><dl> 用来标示创建一个明确的列表<br /><dt> 以来表示使用在DL元素中使用的定义性词语<br /><li> 定义一个列表的一项内容<br /><menu> 创建一个单列的菜单列表<br /><ol> 创建一个有序的列表<br /><ul> 创建一个无序的列表</p><p>第五章链接<br /><a> 用来定义链接和锚<br /><base> 文档中不能被站点辩识的其他所有链接源的URL<br /><link> 定义一个链接和源之间的相互关系</p><p>第六章表格<br /><caption> 显示表格的标题<br /><col> 定义一个列组中的列<br /><colgroup> 定义多个列为一组列<br /><table> 创建一个表格<br /><tbody> 定义一个表格的实体<br /><td> 定义一个表格的内容<br /><tfoot> 定义一个表格的页脚、<br /><th> 定义表格页眉单元格的内容<br /><thead> 定义表格的页眉<br /><tr> 定义表格一行中的单元格</p><p>第七章祯<br /><frame> 定义一个祯<br /><frameset> 定义在一个窗口中的祯的布局<br /><iframe> 创建一个内联的祯<br /><noframes> 当祯这种结构不被支持时候显示</p><p>第八章嵌入式内容<br /><applet> <br /><area> 用来定义链接和锚<br /><img> 在文档中包含一个图片<br /><map> 当area元素中使用时创建一个客户端的图形镜像<br /><object> 包含一个对象<br /><param> 初始化一个对象</p><p>第九章样式<br /><style> 创建一个内部的样式表</p><p>第十章表单<br /><button> 创建一个按钮<br /><fieldset> 把相互关联的空间组合成一组<br /><form> 创建一个包含有能让用户输入数据的控件的表单<br /><input> 定义用在表单中的控件<br /><isindex> 提示用户输入<br /><label> 为一个控件提供标签<br /><legend> 为fieldset元素指定一个标题<br /><option> 在select元素中设置一个选项<br /><select> 为用户做选择创建各个选项<br /><textarea> 创建一个允许用户多行输入的区域</p><p></p> </div> <p style="clear:both;"></p> <p class="translate"> 来自 “ ITPUB博客 ” ，链接：https://blog.itpub.net/219138/viewspace-915515/ ，如需转载，请注明出处，否则将追究法律责任。 </p>  </div> </div> <div class="preview-footer clearfix">  <div class="icon-praise" id="praise" onclick="blogObj.praise($(this),'/praise/')"><span class="text"></span><span class="num">0</span></div> <div class="icon-collect" id="collect" onclick="blogObj.praise($(this),'/favour/')"><span class="text"></span><span class="num">0</span></div> <div class="share-group fr"> <div class="bdsharebuttonbox bdshare-button-style0-16" data-bd-bind="1522216707615"> <span class="fl">分享到：</span> <a href="javascript:;" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博"></a> <a href="javascript:;" class="bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a> <a href="javascript:;" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a> <a href="javascript:;" class="bds_weixin" data-cmd="weixin" title="分享到微信"></a> </div> <script> window._bd_share_config = { "common": { "bdSnsKey": {}, "bdText": "", "bdDesc": "", "bdMini": "", "bdMiniList": false, "bdPic": "", "bdStyle": "0", "bdSize": "32" }, "share": {"bdSize": 16} }; with (document) 0[(getElementsByTagName('head')[0] || body).appendChild(createElement('script')).src = '/static/api/js/share.js?v=89860593.js?cdnversion=' + ~(-new Date() / 36e5)]; if ($(window).width() < 1320) { if ($(window).width() < 1200) { $(".sideslip").css({ "left": "20px", "margin-left": 0 }) } else { $(".sideslip").css({ "margin-left": "-590px" }) } }</script> </div> </div> <div class="article-context"> <div class="fl"> <span class="color77">上一篇：</span> <a href="https://blog.itpub.net/219138/viewspace-915435/">有关内存的思考题</a> </div> <div class="fr"> <span class="color77">下一篇：</span> <a href="https://blog.itpub.net/219138/viewspace-915575/">内存缓冲区研究----第一课</a> </div> </div> <input type="hidden" id="blogId" name="blogId" value="915515">  <div class="blog-comment"> <div class="new-comment"> <input type="hidden" id="hid" name="hid" value="915515"> <input type="hidden" name="_token" value="hpRGBuONiYPKtKmNu2ez7ViUeEmgHKpWJFYA7X87"> <a class="avatar" href="javascript:;"> <img src="/images/user_pic_default.png"></a>  <div class="sign-container"> <span>请登录后发表评论</span> <a class="btn btn-sign"> <a class="layui-btn ml30" onclick="blog.login(event)">登录</a> </a> </div>  <textarea placeholder="请写下你的评论…" onfocus="blogObj.textareaFocus($(this),200)" maxlength=200></textarea> </div> <div class="comment-list"> <div class="top-title"><span class="all-comment">全部评论</span> <span class="colorbb ml20"></span> </div> <div class="comment-items" id="comment_items"> <script type="text/template" id='blog_template'> <%for(var i=0;i <items.length;i++){%> <div class="comment-item"> <div class="author"> <a target="_blank" href="/<%=items[i].uid%>" class="avatar"> <img src="<%=items[i].headimg%>" alt=""> </a> <div class="info"> <div class="name"><a target="_blank" href="/<%=items[i].uid%>"><%=items[i].username%></a> <span class="fr reply-btn" onclick="blogObj.newComment($(this),'<%=items[i].username%>',<%=items[i].id%>)">回复</span> </div> <div class="time colorbb"><%=items[i].createtime%></div> </div> </div> <p class="comment-wrap"><%=items[i].content%></p> <%if(items[i].items.items.length) { %> <div class="sub-comment-list"> <%for(var j=0;j <items [i].items.items.length;j++){%> <div class="sub-comment"> <div class="color77 time-reply"> <span class="time"><%=items[i].items.items[j].createtime%></span> <span class="reply-btn fr" onclick="blogObj.newComment($(this),'<%=items[i].items.items[j].username%>',<%=items[i].items.items[j].id%>)">回复</span> </div> <p><a href="/<%=items[i].uid%>"><%=items[i].items.items[j].username%></a> 回复 <a href="/<%=items[i].touid%>"><%=items[i].items.items[j].tousername%></a>： <span class="content"><%=items[i].items.items[j].content%></span></p> </div> <%}%> <%if(items[i].items.total > 5) { %> <div class="more-comment"><span class="sub-comment-count">还有<i class="count"><%=items[i].items.total-5%></i>条评论</span><span class="more-comment-btn" onclick=blogObj.loadSubComment($(this),<%=items[i].id%>) data-count=1 data-flag=true>点击查看</span> </div> <%}%> </div> <%}%> </div> <%}%> </script> </div> </div> </div>  </div> <script> </script> <div class="fr w290">   <div class="author-info right-fixed "> <div class="head-img"> <a href="https://blog.itpub.net/219138/"><img src="http://account.itpub.net/api/avatar.php?uid=219138" alt=""></a> </div> <div class="author-name"><a href="https://blog.itpub.net/219138/">abcbbc</a></div> <div class="author-intro"> </div> <p class="register-time"><span class="color77">注册时间：</span>2011-09-07</p> <ul class="tree-list clearfix"> <li> <div class="item-tt">博文量</div> <a href="https://blog.itpub.net/219138/"><span class="item-num blognum">56</span></a> </li> <li> <div class="item-tt">访问量</div> <div class="item-num blogviewnum">699643</div> </li> </ul> </div>  <script> var data = {uid: 219138}; $._ajax({ url: '/getAuthorInfo/', data: data, type: 'get', dataType: 'json', success: function (data) { if (data.code == 200) { var data = data.data; $(".blognum").text(data.blognum); $(".blogviewnum").text(data.visitednum); } } }); </script>   <div class="blog-choice right-fixed"> <h3 class="choice-title">最新文章</h3> <ul class="newul"> <li class="new-item"> <a href="https://blog.itpub.net/219138/viewspace-1056072/" class="clearfix"> LNMP一键安装 </a> </li> <li class="new-item"> <a href="https://blog.itpub.net/219138/viewspace-1056071/" class="clearfix"> CentOS 5.5一键安装pptp </a> </li> <li class="new-item"> <a href="https://blog.itpub.net/219138/viewspace-1055685/" class="clearfix"> the method of fixing the problem of using SSIS and SharePointListAdapters to sync data from DB to Sh </a> </li> <li class="new-item"> <a href="https://blog.itpub.net/219138/viewspace-1055676/" class="clearfix"> the method of fixing the problem of using SSIS and SharePointListAdapters to sync data from DB to Sh </a> </li> <li class="new-item"> <a href="https://blog.itpub.net/219138/viewspace-1055090/" class="clearfix"> CSS Padding in Outlook 2007 and 2010 </a> </li> <li class="new-item"> <a href="https://blog.itpub.net/219138/viewspace-1055089/" class="clearfix"> What is the difference between gross sales and revenue? </a> </li> <li class="new-item"> <a href="https://blog.itpub.net/219138/viewspace-1054977/" class="clearfix"> muck around </a> </li> <li class="new-item"> <a href="https://blog.itpub.net/219138/viewspace-1054896/" class="clearfix"> IE下的图片空隙间距BUG和解决办法 </a> </li> <li class="new-item"> <a href="https://blog.itpub.net/219138/viewspace-984561/" class="clearfix"> Dreamweaver默认打开后缀名为ftl的文件时 </a> </li> <li class="new-item"> <a href="https://blog.itpub.net/219138/viewspace-984559/" class="clearfix"> power designer使Comment与Name相同.txt </a> </li> <ul> </div>  </div> </div> <div class="icon-back-top" onclick="$('html,body').animate({scrollTop:0},'slow');"></div>   <script> (function () { var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); </script>  <div class="blog-footer"> <div class="w1200 pr"> <div class="footer-links"> <a class="icon-blog icon-wx mr30"> <div class="wx-qrcode"> <img src="/images/qrcode.jpg" alt=""> </div> </a> <a href="https://weibo.com/itpub2001?from=myfollow_all" class="icon-blog icon-wb" target="_blank"></a> </div> <p class="footer-nav"> <a href="http://www.it168.com/bottomfile/it168.shtml" target="_blank">支持我们</a> <a href="http://www.it168.com/bottomfile/tgzn.shtml" target="_blank">作者招募</a> <a href="http://www.it168.com/bottomfile/sytk.shtml" target="_blank">用户协议</a> <a href="//blog.itpub.net/31509949/viewspace-2157750/" target="_blank">FAQ</a> <a href="http://edu.itpub.net/contactus.html" target="_blank">Contact Us</a> <script src="https://s22.cnzz.com/z_stat.php?id=1274521965&web_id=1274521965" language="JavaScript"></script> </p> <p>北京盛拓优讯信息技术有限公司. 版权所有 <a style="color:#777777;" target="_blank" href="http://beian.miit.gov.cn">京ICP备16024965号-8</a> 北京市公安局海淀分局网监中心备案编号：11010802021510 niuxiaotong@pcpop.com 17352615567 <a style="color:#777777;" target="_blank" href="http://www.it168.com/jubao.html"> 未成年人举报专区</a></p> <p>广播电视节目制作经营许可证(京) 字第1234号中国互联网协会会员</p> <p>违法和不良信息举报电话:18101376593</p> </div> </div>  <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?5016281862f595e78ffa42f085ea0f49"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?540bee2c1a1b922df9e0a0b922440b73"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script>  </body> </html>

ITPub博客

HTML回顾学习