学习笔记5-bootstrap 排版

发布时间：2020-12-17 21:07:08 所属栏目：安全来源：网络整理

导读：1. HTML 中的所有标题标签， h1 ?到? h6 ?均可使用。另外，还提供了? .h1 .h6 ?类，为的是给内联（inline）属性的文本赋予标题的样式。如： h1 h1. Bootstrap heading /h1 h2标题h2/h2 //运行结果：标题h2 h3 h3. Bootstrap heading /h3 // h3. Bootstrap h

1.HTML 中的所有标题标签，<h1>?到?<h6>?均可使用。另外，还提供了?.h1.h6?类，为的是给内联（inline）属性的文本赋予标题的样式。如：

<h1>h1. Bootstrap heading</h1> <h2>标题h2</h2>              //运行结果：标题h2
<h3>h3. Bootstrap heading</h3> //h3. Bootstrap heading
<h4>h4. Bootstrap heading</h4>
<h5>h5. Bootstrap heading</h5>
<h6>h6. Bootstrap heading</h6>

2.在标题内还可以包含?<small>?标签或赋予?.small?类的元素，可以用来标记副标题。如果需要向任何标题添加一个内联子标题，只需要简单地在元素两旁添加 <small>，或者添加?.small?class，就能得到一个字号更小的颜色更浅的文本。<small>.small

<!---运行结果：h1.Bootstrap heading Secondary text--->


<h1>标题<small>副标题</small></h1><h1>h1. Bootstrap heading <small>Secondary text</small></h1>

3.页面主体：

Bootstrap 将全局?font-size?设置为?14px，line-height1.428。这些属性直接赋予?<body>?元素和所有段落元素。另外，<p>?（段落）元素还被设置了等于 1/2 行高（即 10px）的底部外边距（margin）。如： font-sizeline-height<body><p>


<p>...</p>

4.通过添加?.lead?类可以让段落突出显示。如：.lead

5.通过增加 font-weight 值强调一段文本。如：

<strong>rendered as bold text</strong>

6.斜体：


7.下划线：

8.地址让联系信息以最接近日常使用的格式呈现。在每行结尾添加??可以保留需要的样式。
  
  
   
   
Twitter,Inc.
795 Folsom Ave,Suite 600
San Francisco,CA 94107
P:?(123) 456-7890
   
   
Full Name
first.last@example.com

  
  
  
  
   
   Copy
  
  
  
  
   
   
  
  
<em>rendered as italicized text</em> <u>This line of text will render as underlined</u><br><address>
  <strong>Twitter,Inc.</strong><br>
  795 Folsom Ave,Suite 600<br>
  San Francisco,CA 94107<br>
  <abbr title="Phone">P:</abbr> (123) 456-7890
</address>

<strong>Full Name</strong><br>
  <a href="mailto:#">first.last@example.com</a>
</address>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!