亚洲最大看欧美片,亚洲图揄拍自拍另类图片,欧美精品v国产精品v呦,日本在线精品视频免费

  • 站長資訊網(wǎng)
    最全最豐富的資訊網(wǎng)站

    css怎么給文字添加邊框或字體放大效果(代碼詳解)

    之前的文章《手把手教你使用css3給文字添加陰影效果(代碼詳解)》中,給大家介紹了怎樣使用cs3給文字添加陰影效果。下面本篇文章給大家介紹怎樣使用css給文字添加邊框或字體放大效果,我們一起看看怎么做。

    css怎么給文字添加邊框或字體放大效果(代碼詳解)

    css給文字加添邊框或字體放大的方法

    文字邊框

    p{ border:2px solid blue;}

    文字邊框代碼示例

    <meta charset="utf-8">  <title>文字邊框</title> <style> p{ border:2px solid blue;} </style> </head>  <body> <p>中文網(wǎng)1</p> <p>中文網(wǎng)2</p> <p>中文網(wǎng)3</p> </body>  </html>

    代碼效果圖

    css怎么給文字添加邊框或字體放大效果(代碼詳解)

    字體放大

    通過元素的名稱p選中所有的<p>元素

    p{}

    p指定樣式規(guī)則

    p {font-size:200%;} 將字體放大1倍

    字體放大代碼示例

    <!DOCTYPE html> <html> <head> <meta charset="utf-8">  <title>文字邊框</title> <style> 	p{font-size: 200%;} p.one  { 	border-style:dashed; 	border-width:5px; } p.two  { 	border-style:solid; 	border-width:medium; } p.three { 	border-style:solid; 	border-width:1px; } p.four 	{border-style:dashed; 	border-width:2px; 	border-color:red </style> </head>  <body> <p class="one">php中文網(wǎng)</p> <p class="two">php中文網(wǎng)</p> <p class="three">php中文網(wǎng)</p> <p class="four">php中文網(wǎng)</p> </body>  </html>

    字體放大代碼效果圖

    4.jpg

    如果想讓所有的段落擁有灰色背景,使用元素選擇器<p>來定義

    p{background:lightgray;} 選中所有的<p>設(shè)置背景色:亮灰色。

    代碼示例

    <!DOCTYPE html> <html> <head> <meta charset="utf-8">  <title>文字邊框</title> <style> 	p{background:lightgray; font-size: 200%;} p.one  { 	border-style:dashed; 	border-width:5px; } p.two  { 	border-style:solid; 	border-width:medium; } p.three { 	border-style:solid; 	border-width:1px; } p.four 	{border-style:dashed; 	border-width:2px; 	border-color:red </style> </head>  <body> <p class="one">php中文網(wǎng)</p> <p class="two">php中文網(wǎng)</p> <p class="three">php中文網(wǎng)</p> <p class="four">php中文網(wǎng)</p> </body>  </html>

    代碼效果圖

    css怎么給文字添加邊框或字體放大效果(代碼詳解)

    推薦學習:CSS視頻教程

    贊(0)
    分享到: 更多 (0)
    網(wǎng)站地圖   滬ICP備18035694號-2    滬公網(wǎng)安備31011702889846號