Bootstrap入門（三）標簽的css樣式

Bootstrap入門（三）<p>標簽的css樣式

前提：引入css文件，內容放在一個class為container的div中

 

<p>標簽屬性

1.“ text-left ”、“ text-right ”、“ text-center ”屬性控制<p>標簽內容位置

            <p class="text-left">在左</p>
            <p class="text-right">在右</p>
            <p class="text-center">居中</p>  

效果：

2.“ text-lowercase ”、“ text-uppercase ”、“ text-capitalize ”屬性控制<p>標簽英文內容的大小寫 

            

            <p class="text-lowercase">hahahahhahahaha都小寫</p>
            <p class="text-uppercase">hahahahhahahaha都大寫</p>
            <p class="text-capitalize">hahahahhahahaha首字母大寫</p>

效果：

 

3.字體：“text-muted ”、“text-info ”、“text-success ”、“text-warning ”、“text-primary ”、“text-danger ”等屬性，對不同情況下的內容進行不同顏色的標注

            

            <p class="text-muted">text-muted</p>
            <p class="text-info">text-info</p>
            <p class="text-success">text-success</p>
            <p class="text-warning">text-warning</p>
            <p class="text-primary">text-primary</p>
            <p class="text-danger">text-danger</p>

效果：

 

4.背景：“bg-muted ”、“bg-info ”、“bg-success ”、“bg-warning ”、“bg-primary ”、“bg-danger ”等屬性，對不同情況下的內容進行不同顏色背景的標注

            

            <p class="bg-muted">bg-muted</p>
            <p class="bg-info">bg-info</p>
            <p class="bg-success">bg-success</p>
            <p class="bg-warning">bg-warning</p>
            <p class="bg-primary">bg-primary</p>
            <p class="bg-danger">bg-danger</p>

 效果：