【代碼筆記】Web-CSS-CSS Padding（填充）

張憲坤發布于2019-04-23 11:51 / 2360人閱讀

一，效果圖。

二，代碼。

DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>CSS paddingtitle>
    <style>
    p {
        background-color: yellow;
    }
    
    p.padding {
        padding-top: 25px;
        padding-bottom: 25px;
        padding-right: 50px;
        padding-left: 50px;
    }
    style>
head>

<body>
    <p>This is a paragraph with no specified padding.p>
    <p class="padding">This is a paragraph with specified paddings.p>
body>

html>

參考資料：《菜鳥教程》

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/1251.html

【代碼筆記】Web-CSS-CSS樣式列表(url)

一，效果圖。二，代碼。 ? DOCTYPE html> CSS 樣式列表(url) ul.a { list-style: circle; } ul.b { list-style: square; } ol.c { list-style: upper-...

Jiavan 2019-04-23 11:52 評論0 收藏0
【代碼筆記】Web-CSS-CSS Table(表格）

一，效果圖。二，代碼。 ? DOCTYPE html> CSS Table表格 table { border-collapse: collapse; width: 100%; } table, th, td { border: 1px solid green;...

sevi_stuo 2019-04-23 11:52 評論0 收藏0
【代碼筆記】Web-CSS-CSS盒子模型

一，效果圖。 ? the picture above is 250px wide.the total width of this element is also 250px. ? 參考資料:《菜鳥教程》

KunMinX 2019-04-23 11:52 評論0 收藏0
【代碼筆記】Web-CSS-CSS Align

一，效果圖。二，代碼。DOCTYPEhtml><html><head><metacharset="utf-8"><title>CSSAligntitle><style>body{margin:0;padding:0;} .container{position:relative;width:100%;} ...

番茄西紅柿 2019-04-23 11:49 評論0 收藏0
【代碼筆記】Web-CSS-CSS 教程

一，效果圖。二，代碼。 DOCTYPE html> CSS 教程 body { background-color: #d0e4fe; } h1 { color: range; text-align: center; } p { fon...

endless_road 2019-04-23 11:55 評論0 收藏0