{"id":976,"date":"2020-05-22T13:17:29","date_gmt":"2020-05-22T10:17:29","guid":{"rendered":"http:\/\/www.aydiner.gen.tr\/?p=976"},"modified":"2022-01-30T22:55:46","modified_gmt":"2022-01-30T19:55:46","slug":"bootstrap-4-margin-ve-padding","status":"publish","type":"post","link":"https:\/\/www.aydiner.gen.tr\/index.php\/2020\/05\/22\/bootstrap-4-margin-ve-padding\/","title":{"rendered":"BOOTSTRAP 4 MARG\u0130N VE PADD\u0130NG"},"content":{"rendered":"

\"\"<\/a>HTML ve CSS d\u00fczeninde bir eleman\u0131n kenarl\u0131\u011f\u0131 ile d\u0131\u015f\u0131ndaki nesneler aras\u0131ndaki mesafeye\u00a0margin(d\u0131\u015f bo\u015fluk) ad\u0131 verilir.<\/strong>
\nAyn\u0131 \u015fekilde bir nesnenin kenarl\u0131\u011f\u0131 ile i\u00e7inde bulunan i\u00e7erik aras\u0131ndaki bo\u015flu\u011fa ise\u00a0padding(i\u00e7 bo\u015fluk)<\/strong>\u00a0denir.<\/p>\n

Bootstrap 4’te margin ve padding i\u00e7in de haz\u0131r baz\u0131 \u00f6zellikler bulunmaktad\u0131r.<\/p>\n

Margin =>\u00a0m<\/strong>
\npadding =>\u00a0p<\/strong><\/p>\n

top (\u00fcst) = >\u00a0t<\/strong>
\nbottom (alt) = >\u00a0b<\/strong>
\nright (sa\u011f) = >\u00a0r<\/strong>
\nleft (sol) = >\u00a0l<\/strong>
\nx boyutu (sa\u011f – sol) = >\u00a0x<\/strong>
\ny boyutu (\u00fcst – alt) = >\u00a0y<\/strong>
\nHer tarafa ayn\u0131 b\u00fcy\u00fckl\u00fck verilecek ise bo\u015f b\u0131rak\u0131l\u0131r.<\/p>\n

0 ile 5 aras\u0131nda<\/strong>\u00a0b\u00fcy\u00fckl\u00fck verilebilir, ayr\u0131ca\u00a0auto<\/strong>\u00a0da otomatik \u00f6zellik vermek i\u00e7in kullan\u0131l\u0131r<\/p>\n

\u00d6rne\u011fin;<\/p>\n

<div class=”mt-3″>Bu div’e \u00fcstten 3 birim margin verilmi\u015ftir.<\/div><\/p>\n

<div class=”p-2″>Bu div’e her y\u00f6nden 2 birim padding verilmi\u015ftir.<\/div><\/p>\n

<div class=”my-2 px-1″>Bu div’e \u00fcstten ve alttan 2 birim margin ve soldan sa\u011fdan 1 birim padding verilmi\u015ftir.<\/div><\/p>\n

Not:\u00a0<\/strong>E\u011fer p ya da m nin yan\u0131na herhangi bir harfa gelmezse her 4 tarafa da ayn\u0131 b\u00fcy\u00fckl\u00fck verilecek demektir.<\/p>\n","protected":false},"excerpt":{"rendered":"

HTML ve CSS d\u00fczeninde bir eleman\u0131n kenarl\u0131\u011f\u0131 ile d\u0131\u015f\u0131ndaki nesneler aras\u0131ndaki mesafeye\u00a0margin(d\u0131\u015f bo\u015fluk) ad\u0131 verilir. Ayn\u0131 \u015fekilde bir nesnenin kenarl\u0131\u011f\u0131 […]<\/p>\n","protected":false},"author":1,"featured_media":849,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6],"tags":[108],"class_list":["post-976","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web","tag-bootstrap-margin-ve-padding"],"_links":{"self":[{"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/posts\/976","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/comments?post=976"}],"version-history":[{"count":0,"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/posts\/976\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/media\/849"}],"wp:attachment":[{"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/media?parent=976"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/categories?post=976"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/tags?post=976"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}