css基礎樣式中的padding樣式

CSS 程序世界 程序世界 2017-08-30

今天我們來說padding 它代表的是內邊距。

先在div中輸入“程序世界”四個字，然後再在樣式中分別設置它的上、右、下、左四個內邊距。

css基礎樣式中的padding樣式

上面代碼中padding-top代表上內邊距

padding-right代表右內邊距

padding-bottom代表下內邊距

padding-left代表左內邊距

css基礎樣式中的padding樣式

它除了可以分別設置內邊距外，還可以複合寫法。

css基礎樣式中的padding樣式

padding:10px; 一個值 代表上右下左都是10px

如果寫兩個值：padding：10px 20px；兩個值，第一個值代表上下，第二個值代表左右。

三個值 ：第一個值代表上 第二個值代表左右 第三個值代表下

四個值：第一個值代表上 第二個值代表右 第三個值代表下 第三個值代表左

如果在div中把文字換成圖片標籤，同樣也適用上面的padding寫法。

css基礎樣式中的padding樣式

css基礎樣式中的padding樣式

相關推薦

'中秋佳節：沒編程合集大團圓！318本編出電子書籍➕視頻資料項目'
"中秋節佳節，小夥伴們都放假開心的回家團圓去了吧？這不、小編給你們帶來了更開心的事情、那就是給你們準備好了編程合集大團圓！全網最全編程語言視頻教程（從零基礎到大牛哦！）包含java、python、web、大數據、人工智能、等視頻教程+項目+源碼，現在免費分享給各位！[領取方...
Java 人工智能 Linux 技術 腳本語言 大數據 Node.js UNIX 程序設計 設計 Python 數據庫 移動互聯網 HTML HTML5 編程語言 操作系統 最圓不過中秋月 網頁設計 CSS 程序員 JavaScript JSP 自然語言處理 GNU ASP IBM Velocity 讀書 中央處理器 硬件 英語 PHP 文章 2019-09-17
'CSS選擇器和優先級總結，告誡自己不能任性使用！important'
"如果在項目裡面使用了通用的reset.css樣式，但是在具體的頁面裡面要對同一個樣式進行覆蓋式修改，不借助與scoped的和inner style，你會怎麼做？會不會像我一樣在剛接觸的時候給要覆蓋的樣式後面加上!important屬性本文將告訴大家關於CSS選擇器和優先級...
CSS 瀏覽器 算法 HTML 2019-09-12
'0基礎學Python從哪入手？3個月快速學會Python的祕訣是什麼？'
"如果已經學習了一點其它編程語言，該怎麼快速瞭解和學習Python呢？如何用3個月快速學會Python？零基礎，我想學一門數據分析的語言，不敢說是謀生用，只是想掌握一種工具。沒事爬點有用的數據資料什麼的。1題主如果想要利用python爬取數據資料，本人目前也正在學習Pyth...
Python 網絡爬蟲 Linux 數據庫 Scrapy 操作系統 技術 慕課網 瀏覽器 HTML 虛擬機 編程語言 電腦 面向對象程序編程 坦克大戰 CSS 2019-09-08
'零基礎Python學習路線圖，Python初學者必須要了解，讓你少走彎路'
"近幾年Python的受歡迎程度可謂是扶搖直上，當然了學習的人也是愈來愈多。一些學習Python的小白在學習初期，總希望能夠得到一份Python學習路線圖，小編經過多方彙總為大家彙總了一份Python學習路線圖。對於一個零基礎的想學習python的朋友來說，學習方法很重要，...
Python 網絡爬蟲 Linux 人生第一份工作 算法 數據結構 人工智能 數據庫 機器學習 Redis CSS MySQL jQuery Scrapy Git JavaScript 設計 2019-09-06
'python爬蟲入門，10分鐘就夠了，這可能是我見過最簡單的基礎教學'
"一、基礎入門1.1什麼是爬蟲爬蟲(spider，又網絡爬蟲)，是指向網站/網絡發起請求，獲取資源後分析並提取有用數據的程序。從技術層面來說就是 通過程序模擬瀏覽器請求站點的行為，把站點返回的HTML代碼/JSON數據/二進制數據（圖片、視頻） 爬到本地，進而提取自己需要的...
Python 網絡爬蟲 瀏覽器 HTML XML 數據庫 JSON CSS 技術 Redis MySQL 2019-08-29
'沒有編程基礎，看到這篇文章你就能學Python啦'
"在人工智能日趨成熟的時代裡，有大量的數據需要被處理。同時，在 AI、VR 以及無人汽車、無人機和智能家居的數據處理中我們都能看到 Python 的身影，這就促使企業未來對 Python 的需求將會不斷提升。至於 Python 火爆的原因，在我看來，無非就是以下兩點：1. ...
Python 人工智能 編程語言 Scrapy 文章 數據庫 Linux Redis 網絡爬蟲 NoSQL SQL CSS 設計 Google MongoDB HTML HDFS 泛函編程 Flask 程序設計 搜索引擎 設計模式 電腦 Mac電腦 人生第一份工作 jQuery 智能家居 MySQL Nginx HTML5 2019-08-25
'CSS 偽元素基礎知識：before 與after （一）'
"最近因為一些網頁的需要，需要比較深入的使用了CSS 的「偽元素」( Pseudo Element )，發現原來不只是用用before或after 而已，可以玩的東西還真是不少，所以就來篇文章，把這些比較不常玩的用法歸納整理下，希望對你的日常工作有所幫助。什麼是「偽元素」？...
CSS Google HTML 瀏覽器 JavaScript Line 文章 2019-08-17
'一次搞懂CSS 字體單位：px、em、rem 和 %'
"對於繪圖和印刷而言，「單位」很相當重要的，然而在網頁排版裡，單位也是同樣具有重要性，在CSS3 普及以來，更添加了一些方便好用的單位( px、em、rem.. .等)，這篇文章將整理這些常用的CSS 單位，希望能夠幫助到你在工作上能使用的更加得心應手。「網頁」和「印刷」的...
CSS HTML Medium 設計 瀏覽器 2019-08-15
'網站建設中客戶需要關心的問題？'
"2017年為規範網站建設環境,我公司專門針對經常問到的幾個問題,給大家做了一些回覆和解釋,請大家詳細瞭解下建站過程中所能遇到的問題;能否先出個效果圖給我們看看？如果不是數萬元以上的大型項目參與競標需要外，我們都是要先簽訂合同收了定金後才出設計的。沒有油的車是開不動的!任何...
設計 技術 人生第一份工作 投資 市場營銷 CSS 黑客 2019-08-14
'IT大牛告訴你：如何快速從零基礎，成為編程大神'
"首先要求這幾點：1、做一名程序員，絕對要耐得住寂寞，並且要一直有點興趣促進你學習。如果你完全沒興趣，你是不可能學會編程。2、能抗壓。咱幹程序員這一行業，沒填幾乎都是面對枯燥的代碼，經常要面臨著加班，除非你特意去很輕鬆的公司上班。滿足了這兩點，那就開始努力學習吧。在分享學習...
Java Python 編程語言 JavaScript 數據庫 C語言 HTML SQL MySQL 大學 Microsoft SQL Server 程序員 電腦 Android Studio Android 程序設計 人工智能 jQuery CSS JSP 人生第一份工作 2019-08-14
'《web全棧工程師》中總結的20條軍規和必讀書單，很值得收藏喲'
"作為一個前端新人，應該不斷學習加強各種基礎技術，而且也要多看別人的建議，別人成功的經歷或許不能讓你複製，但是你總能從中有所收穫，身體和靈魂總要有一個在路上。今天抱起了實習時候充充翻過的一本書《web全棧工程師》，作者是騰訊的高級UI工程師雨果，序章就已經講述了他從一個菜鳥...
工程師 程序員 技術 人生第一份工作 讀書 多看閱讀 HTML Git 產品經理 大學 WebApp GitHub CSS 電腦 跳槽那些事兒 筆記本電腦 騰訊 2019-08-05
'物聯網中的LoRa，到底是個什麼鬼？'
"物聯網正成風口。如今處於物聯網時代，隨著物聯網的快速發展，無線通信技術也得以邁步發展，在物聯網網絡層的多種連接技術裡，不僅需要速率和穩定性更高的5G技術，也需要低功耗、遠距離、大連接的LPWAN（Low-Power Wide-Area Network，低功耗廣域網絡）技術...
物聯網 技術 通信 智能家居 CSS 設計 工業設計 我的第一部5G手機 法國 Google 2019-08-05
'CSS 2019互聯網安全領袖峰會引關注，安全生態建設成共識'
"當前，5G、量子通信、人工智能、區塊鏈等具有顛覆性的戰略性新技術在各國的大力推動下日趨成熟，物聯網、大數據、雲計算、物聯網等基礎應用持續深化，這無疑是可喜的。與此同時，網絡攻擊、智能犯罪、數據洩露等網絡安全問題也呈現出許多新變化，危害國家關鍵基礎設施安全、社會穩定與民眾隱...
CSS 網絡安全 技術 物聯網 我的第一部5G手機 騰訊 大數據 雲計算 人工智能 通信 軟件 能源 2019-08-03
'前端項目迭代發版防止瀏覽器緩存js和css'
"歡迎關注我的頭條號：Wooola，專注於Java、Golang、微服務架構，致力於每天分享原創文章、快樂編碼和開源技術。前言最近發版前端項目，用戶經常反饋新添加功能在線上環境不好用，常出現新老頁面並存的狀況。經前端同事排查法發現，實際上只需要重新刷新一下頁面就沒事了。但是...
CSS 瀏覽器 JavaScript Java 2019-07-27
'5年Python開發經驗分享：零基礎如何自學Python？'
"這是昨天一個加我好友的Python初學者問我的問題：機械工程專業零基礎如何自學Python ？程序員在普通人眼裡就像魔法師，一個腳本輕鬆搶幾十盒月餅，一個插件解決春運搶票難題，幾行代碼搭建一個網站，用微信自動聊天，在程序員眼裡這些事太稀鬆平常了，他們只不過是利用了編程語言...
Python CSS 瀏覽器 JavaScript Linux 數據庫 SQL 程序員 HTML 網絡爬蟲 腳本語言 HTML5 人工智能 jQuery 電腦 跳槽那些事兒 數據結構 通信 讀書 程序設計 2019-07-26
'電腦絕技教你22天學精Csharp之第十九天HTML和CSS補充3'
" 1、CSS是Cascading Style Sheet這個幾個英文單詞的縮寫，翻譯成中文是“層疊樣式表”的意思。CSS能讓網頁製作者有效的定製、改善網頁的效果。CSS是對HTML的補充，網頁設計師曾經為無法很好的控制網頁的顯示效果而倍感苦惱，CSS的出現解決了這個問題...
CSS HTML C# Word 電腦 2019-07-21
'Java基礎晉升大牛路線經驗資料總結，入門到深入二'
"Java最新路線資料經驗(二)3.4數據庫3.4.1目標1)完全掌握數據庫sql的使用以及使用java執行sql3.4.2數據庫本身3.4.2.1 基本數據庫知識1）通用知識：事務2）mysql專有特點，權限等3）數據類型4）約束5）索引3.4.2.2 RDBMS術語1）...
Java 數據庫 MySQL JSON Linux 跳槽那些事兒 SQL XML Tomcat CSS jQuery HTML5 設計模式 設計 技術 Velocity 數學 2019-07-19
'電腦絕技教你22天學精Csharp之第十九天HTML和CSS補充2'
"1、註釋符單行註釋 // 註釋單行代碼多行註釋 /*要註釋內容*/文檔註釋 /// 註釋類和方法HTML <!--要註釋的內容-->CSS /*要註釋的內容*/2、命名規範Camel駱駝命名規範:要求首單詞的首字母小寫，其餘單詞首字母大寫，變量、字段int a...
C# HTML CSS 電腦 Pascal 2019-07-19
'Java基礎到高級工程師最詳細之路—小白Java學習路線'
"Java工程師修煉最詳細之路—小白Java學習路線Java工程師修煉之路—小白Java學習路線Java分成J2ME（移動應用開發），J2SE（桌面應用開發），J2EE(Web企業級應用)，所以Java並不是單機版的，只是面嚮對象語言。建議如果學習Java體系的話可以這樣去...
Java JSP 工程師 數據庫 HTML JavaScript 技術 設計模式 XML 腳本語言 SQL Tomcat CSS 2019-07-19
'如何系統地學習前端基礎和底層原理？看完這些書就夠了'
"前端小智：https://segmentfault.com/a/1190000017072371對於前端的學習和提高，首先前端的三個最基本的東西 HTML5、CSS3 和 JavaScript（ES6）是必須要學好的。這其中有很多很多的技術，比如，CSS3 引申出來的 C...
CSS HTML5 JavaScript WebGL 技術 瀏覽器 設計 HTML 程序員 Google Twitter 泛函編程 小遊戲 文章 2019-07-16
推薦中...