{"id":2055,"date":"2021-01-04T07:07:46","date_gmt":"2021-01-04T07:07:46","guid":{"rendered":"https:\/\/www.pythontutorial.net\/?page_id=2055"},"modified":"2021-01-05T01:39:53","modified_gmt":"2021-01-05T01:39:53","slug":"ttk-elements","status":"publish","type":"page","link":"https:\/\/www.pythontutorial.net\/tkinter\/ttk-elements\/","title":{"rendered":"Ttk Elements"},"content":{"rendered":"\n<p><strong>Summary<\/strong>: in this tutorial, you&#8217;ll learn about the ttk elements and how they are assembled into styles of widgets.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id='introduction-to-ttk-elements'>Introduction to ttk elements <a href=\"#introduction-to-ttk-elements\" class=\"anchor\" id=\"introduction-to-ttk-elements\" title=\"Anchor for Introduction to ttk elements\">#<\/a><\/h2>\n\n\n\n<p>So far, you have learned that a <a href=\"https:\/\/www.pythontutorial.net\/tkinter\/tkinter-theme\/\">theme<\/a> is a collection of <a href=\"https:\/\/www.pythontutorial.net\/tkinter\/ttk-style\/\">styles<\/a> that defines the appearance of all <a href=\"https:\/\/www.pythontutorial.net\/tkinter\/tkinter-ttk\/\">ttk widgets<\/a>.<\/p>\n\n\n\n<p>A style is a description of the appearance of a widget class. A style is composed of one or more elements.<\/p>\n\n\n\n<p>For example, a <code>Label<\/code> consists of <code>border<\/code>, <code>padding<\/code> and <code>label<\/code> elements. And these elements are nested within each other like the following picture:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"453\" height=\"234\" src=\"https:\/\/www.pythontutorial.net\/wp-content\/uploads\/2021\/01\/ttk-elements-TLabel.png\" alt=\"\" class=\"wp-image-2056\" srcset=\"https:\/\/www.pythontutorial.net\/wp-content\/uploads\/2021\/01\/ttk-elements-TLabel.png 453w, https:\/\/www.pythontutorial.net\/wp-content\/uploads\/2021\/01\/ttk-elements-TLabel-300x155.png 300w\" sizes=\"auto, (max-width: 453px) 100vw, 453px\" \/><\/figure><\/div>\n\n\n\n<p>In general, most of the built-in <a href=\"https:\/\/www.pythontutorial.net\/tkinter\/ttk-style\/\">ttk styles<\/a> use the concept of a layout to organize the different element layers that build up a widget.<\/p>\n\n\n\n<p>To get the layout of a widget class, you use the <code>layout()<\/code> method of the <code>Style<\/code> object like this:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-1\" data-shcb-language-name=\"Python\" data-shcb-language-slug=\"python\"><span><code class=\"hljs language-python\">style.layout(widget_class)<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-1\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">Python<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">python<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>If a widget class doesn&#8217;t have a layout, the <code>layout()<\/code> method will raise a <code>tk.TclError<\/code> exception.<\/p>\n\n\n\n<p>The <code>layout()<\/code> method returns a list of tuples (<code>element_name<\/code>, <code>description<\/code>), where:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li><code>element_name<\/code> is the name of the element.<\/li><li><code>description<\/code> is a dictionary that describes the element.<\/li><\/ul>\n\n\n\n<p>The following example uses the <code>layout()<\/code> method to get the layout of the <code>TLabel<\/code> widget class:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-2\" data-shcb-language-name=\"Python\" data-shcb-language-slug=\"python\"><span><code class=\"hljs language-python\"><span class=\"hljs-keyword\">import<\/span> tkinter <span class=\"hljs-keyword\">as<\/span> tk\n<span class=\"hljs-keyword\">from<\/span> tkinter <span class=\"hljs-keyword\">import<\/span> ttk\n\n\n<span class=\"hljs-class\"><span class=\"hljs-keyword\">class<\/span> <span class=\"hljs-title\">App<\/span><span class=\"hljs-params\">(tk.Tk)<\/span>:<\/span>\n    <span class=\"hljs-function\"><span class=\"hljs-keyword\">def<\/span> <span class=\"hljs-title\">__init__<\/span><span class=\"hljs-params\">(self)<\/span>:<\/span>\n        super().__init__()\n\n        style = ttk.Style(self)\n\n        layout = style.layout(<span class=\"hljs-string\">'TLabel'<\/span>)\n        print(layout)\n\n\n<span class=\"hljs-keyword\">if<\/span> __name__ == <span class=\"hljs-string\">\"__main__\"<\/span>:\n    app = App()\n    app.mainloop()<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-2\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">Python<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">python<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>The following output shows the style&#8217;s layout of the <code>TLabel<\/code>:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"662\" height=\"278\" src=\"https:\/\/www.pythontutorial.net\/wp-content\/uploads\/2021\/01\/ttk-elements-Layout.png\" alt=\"\" class=\"wp-image-2058\" srcset=\"https:\/\/www.pythontutorial.net\/wp-content\/uploads\/2021\/01\/ttk-elements-Layout.png 662w, https:\/\/www.pythontutorial.net\/wp-content\/uploads\/2021\/01\/ttk-elements-Layout-300x126.png 300w\" sizes=\"auto, (max-width: 662px) 100vw, 662px\" \/><\/figure>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-3\" data-shcb-language-name=\"Python\" data-shcb-language-slug=\"python\"><span><code class=\"hljs language-python\">&#91;(<span class=\"hljs-string\">'Label.border'<\/span>,\n\u00a0\u00a0\u00a0\u00a0{<span class=\"hljs-string\">'sticky'<\/span>:\u00a0<span class=\"hljs-string\">'nswe'<\/span>,\n\u00a0\u00a0\u00a0\u00a0\u00a0<span class=\"hljs-string\">'border'<\/span>:\u00a0<span class=\"hljs-string\">'1'<\/span>,\n\u00a0\u00a0\u00a0\u00a0\u00a0<span class=\"hljs-string\">'children'<\/span>:\u00a0&#91;(<span class=\"hljs-string\">'Label.padding'<\/span>,\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0{<span class=\"hljs-string\">'sticky'<\/span>:\u00a0<span class=\"hljs-string\">'nswe'<\/span>,\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<span class=\"hljs-string\">'border'<\/span>:\u00a0<span class=\"hljs-string\">'1'<\/span>,\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<span class=\"hljs-string\">'children'<\/span>:\u00a0&#91;(<span class=\"hljs-string\">'Label.label'<\/span>,\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0{<span class=\"hljs-string\">'sticky'<\/span>:\u00a0<span class=\"hljs-string\">'nswe'<\/span>})]\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0})]\n\u00a0\u00a0\u00a0\u00a0\u00a0}\n)]<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-3\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">Python<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">python<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>The <code>TLabel<\/code> has three elements nested within each other:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>The <code>Label.border<\/code> is the outermost element that has the <code>sticky<\/code>, <code>border<\/code>, and <code>children<\/code> keys.<\/li><li>The <code>Label.padding<\/code> is nested inside the <code>Label.border<\/code>. It also has the <code>sticky<\/code>, <code>border<\/code>, and <code>children<\/code> keys.<\/li><li>The <code>Label.label<\/code> is the innermost element that has only one <code>sticky<\/code> key.<\/li><\/ul>\n\n\n\n<p>For example, when an element has a <code>sticky<\/code> key with the value of <code>nswe<\/code>, it would be stretched to adhere to the north, south, west, and east of the parent element.<\/p>\n\n\n\n<p class=\"note\">Note that the style&#8217;s layout of a widget&#8217;s class depends on the current <a href=\"https:\/\/www.pythontutorial.net\/tkinter\/tkinter-theme\/\">theme<\/a>. If you change the theme, the layout may be different.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id='element-options'>Element options <a href=\"#element-options\" class=\"anchor\" id=\"element-options\" title=\"Anchor for Element options\">#<\/a><\/h2>\n\n\n\n<p>Each element has a list of options that specify the appearance of the element. To get the list of option names, you use the <code>element_options()<\/code> method of <code>Style<\/code> object:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-4\" data-shcb-language-name=\"Python\" data-shcb-language-slug=\"python\"><span><code class=\"hljs language-python\">style.element_options(styleName)<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-4\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">Python<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">python<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>The following program shows the element options of the <code>Label.border<\/code>, <code>Label.padding<\/code>, and <code>Label.label<\/code> elements:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-5\" data-shcb-language-name=\"Python\" data-shcb-language-slug=\"python\"><span><code class=\"hljs language-python\"><span class=\"hljs-keyword\">import<\/span> tkinter <span class=\"hljs-keyword\">as<\/span> tk\n<span class=\"hljs-keyword\">from<\/span> tkinter <span class=\"hljs-keyword\">import<\/span> ttk\n\n\n<span class=\"hljs-class\"><span class=\"hljs-keyword\">class<\/span> <span class=\"hljs-title\">App<\/span><span class=\"hljs-params\">(tk.Tk)<\/span>:<\/span>\n    <span class=\"hljs-function\"><span class=\"hljs-keyword\">def<\/span> <span class=\"hljs-title\">__init__<\/span><span class=\"hljs-params\">(self)<\/span>:<\/span>\n        super().__init__()\n\n        style = ttk.Style(self)\n\n        <span class=\"hljs-comment\"># layout<\/span>\n        layout = style.layout(<span class=\"hljs-string\">'TLabel'<\/span>)\n        print(layout)\n\n        <span class=\"hljs-comment\"># element options<\/span>\n        print(style.element_options(<span class=\"hljs-string\">'Label.border'<\/span>))\n        print(style.element_options(<span class=\"hljs-string\">'Label.padding'<\/span>))\n        print(style.element_options(<span class=\"hljs-string\">'Label.label'<\/span>))\n\n\n<span class=\"hljs-keyword\">if<\/span> __name__ == <span class=\"hljs-string\">\"__main__\"<\/span>:\n    app = App()\n    app.mainloop()<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-5\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">Python<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">python<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>Output:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-6\" data-shcb-language-name=\"Python\" data-shcb-language-slug=\"python\"><span><code class=\"hljs language-python\">(<span class=\"hljs-string\">'relief'<\/span>,)\n(<span class=\"hljs-string\">'padding'<\/span>, <span class=\"hljs-string\">'relief'<\/span>, <span class=\"hljs-string\">'shiftrelief'<\/span>)\n(<span class=\"hljs-string\">'compound'<\/span>, <span class=\"hljs-string\">'space'<\/span>, <span class=\"hljs-string\">'text'<\/span>, <span class=\"hljs-string\">'font'<\/span>, <span class=\"hljs-string\">'foreground'<\/span>, <span class=\"hljs-string\">'underline'<\/span>, <span class=\"hljs-string\">'width'<\/span>, <span class=\"hljs-string\">'anchor'<\/span>, <span class=\"hljs-string\">'justify'<\/span>, <span class=\"hljs-string\">'wraplength'<\/span>, <span class=\"hljs-string\">'embossed'<\/span>, <span class=\"hljs-string\">'image'<\/span>, <span class=\"hljs-string\">'stipple'<\/span>, <span class=\"hljs-string\">'background'<\/span>)<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-6\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">Python<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">python<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>In this output:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>The <code>Label.border<\/code> element has one option: <code>'relief'<\/code>. <\/li><li>The <code>Label.padding<\/code> element has three options: <code>'padding'<\/code>, <code>'relief'<\/code>, and <code>'shiftrelief'<\/code>. <\/li><li>The <code>Label.label<\/code> element has many options including <code>'font'<\/code>, <code>'foreground'<\/code>, <code>'with'<\/code>, etc.<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id='attributes-of-element-options'>Attributes of element options <a href=\"#attributes-of-element-options\" class=\"anchor\" id=\"attributes-of-element-options\" title=\"Anchor for Attributes of element options\">#<\/a><\/h2>\n\n\n\n<p>To get a list of attributes associated with an element option, you use the <code>lookup()<\/code> method of the <code>Style<\/code> object:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-7\" data-shcb-language-name=\"Python\" data-shcb-language-slug=\"python\"><span><code class=\"hljs language-python\">style.lookup(layout_name, option_name)<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-7\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">Python<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">python<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>The following example shows the attributes of the <code>font<\/code>, <code>foreground<\/code>, and <code>background<\/code> options in the <code>TLabel.label<\/code> element:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-8\" data-shcb-language-name=\"Python\" data-shcb-language-slug=\"python\"><span><code class=\"hljs language-python\"><span class=\"hljs-keyword\">import<\/span> tkinter <span class=\"hljs-keyword\">as<\/span> tk\n<span class=\"hljs-keyword\">from<\/span> tkinter <span class=\"hljs-keyword\">import<\/span> ttk\n\n\n<span class=\"hljs-class\"><span class=\"hljs-keyword\">class<\/span> <span class=\"hljs-title\">App<\/span><span class=\"hljs-params\">(tk.Tk)<\/span>:<\/span>\n    <span class=\"hljs-function\"><span class=\"hljs-keyword\">def<\/span> <span class=\"hljs-title\">__init__<\/span><span class=\"hljs-params\">(self)<\/span>:<\/span>\n        super().__init__()\n\n        style = ttk.Style(self)\n\n        <span class=\"hljs-comment\"># attributes of the font, foreground, and background<\/span>\n        <span class=\"hljs-comment\"># of the Label.label element<\/span>\n        print(style.lookup(<span class=\"hljs-string\">'Label.label'<\/span>, <span class=\"hljs-string\">'font'<\/span>))\n        print(style.lookup(<span class=\"hljs-string\">'Label.label'<\/span>, <span class=\"hljs-string\">'foreground'<\/span>))\n        print(style.lookup(<span class=\"hljs-string\">'Label.label'<\/span>, <span class=\"hljs-string\">'background'<\/span>))\n\n\n<span class=\"hljs-keyword\">if<\/span> __name__ == <span class=\"hljs-string\">\"__main__\"<\/span>:\n    app = App()\n    app.mainloop()<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-8\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">Python<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">python<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>Output:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-9\" data-shcb-language-name=\"Python\" data-shcb-language-slug=\"python\"><span><code class=\"hljs language-python\">TkDefaultFont\nSystemWindowText\nSystemButtonFace<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-9\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">Python<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">python<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>As you can see clearly from the output, the <code>font<\/code> is <code>TkDefaultFont<\/code>, the <code>foreground<\/code> is <code>SystemWindowText<\/code>, and the <code>background<\/code> is <code>SystemButtonFace<\/code>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id='put-it-all-together'>Put it all together <a href=\"#put-it-all-together\" class=\"anchor\" id=\"put-it-all-together\" title=\"Anchor for Put it all together\">#<\/a><\/h2>\n\n\n\n<p>The following shows how to change the appearance of a <code>Label<\/code> widget:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-10\" data-shcb-language-name=\"Python\" data-shcb-language-slug=\"python\"><span><code class=\"hljs language-python\"><span class=\"hljs-keyword\">import<\/span> tkinter <span class=\"hljs-keyword\">as<\/span> tk\n<span class=\"hljs-keyword\">from<\/span> tkinter <span class=\"hljs-keyword\">import<\/span> ttk\n\n\n<span class=\"hljs-class\"><span class=\"hljs-keyword\">class<\/span> <span class=\"hljs-title\">App<\/span><span class=\"hljs-params\">(tk.Tk)<\/span>:<\/span>\n    <span class=\"hljs-function\"><span class=\"hljs-keyword\">def<\/span> <span class=\"hljs-title\">__init__<\/span><span class=\"hljs-params\">(self)<\/span>:<\/span>\n        super().__init__()\n\n        self.geometry(<span class=\"hljs-string\">'500x100'<\/span>)\n\n        message = <span class=\"hljs-string\">'This is an error message!'<\/span>\n\n        label = ttk.Label(self, text=message, style=<span class=\"hljs-string\">'Error.TLabel'<\/span>)\n        label.pack(expand=<span class=\"hljs-literal\">True<\/span>)\n\n        style = ttk.Style(self)\n\n        style.configure(<span class=\"hljs-string\">'Error.TLabel'<\/span>, foreground=<span class=\"hljs-string\">'white'<\/span>)\n        style.configure(<span class=\"hljs-string\">'Error.TLabel'<\/span>, background=<span class=\"hljs-string\">'red'<\/span>)\n        style.configure(<span class=\"hljs-string\">'Error.TLabel'<\/span>, font=(<span class=\"hljs-string\">'Helvetica'<\/span>, <span class=\"hljs-number\">12<\/span>))\n        style.configure(<span class=\"hljs-string\">'Error.TLabel'<\/span>, padding=(<span class=\"hljs-number\">10<\/span>, <span class=\"hljs-number\">10<\/span>))\n\n\n<span class=\"hljs-keyword\">if<\/span> __name__ == <span class=\"hljs-string\">\"__main__\"<\/span>:\n    app = App()\n    app.mainloop()<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-10\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">Python<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">python<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<h2 class=\"wp-block-heading\" id='summary'>Summary <a href=\"#summary\" class=\"anchor\" id=\"summary\" title=\"Anchor for Summary\">#<\/a><\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>A ttk widget is made up of elements. The <code>layout<\/code> determines how elements assembled the widget.<\/li><li>Use the <code>Style.layout()<\/code> method to retrieve the layout of a widget class.<\/li><li>Use the <code>Style.element_options()<\/code> method to get the element options of an element.<\/li><li>Use the <code>Style.lookup()<\/code> method to get the attributes of an element option.<\/li><\/ul>\n<div class=\"helpful-block-content\" data-title=\"\">\n\t<header>\n\t\t<div class=\"wth-question\">Was this tutorial helpful ?<\/div>\n\t\t<div class=\"wth-thumbs\">\n\t\t\t<button\n\t\t\t\tdata-post=\"2055\"\n\t\t\t\tdata-post-url=\"https:\/\/www.pythontutorial.net\/tkinter\/ttk-elements\/\"\n\t\t\t\tdata-post-title=\"Ttk Elements\"\n\t\t\t\tdata-response=\"1\"\n\t\t\t\tclass=\"wth-btn-rounded wth-yes-btn\"\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tfill=\"none\"\n\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\tclass=\"feather feather-thumbs-up block w-full h-full\"\n\t\t\t\t>\n\t\t\t\t\t<path\n\t\t\t\t\t\td=\"M14 9V5a3 3 0 0 0-3-3l-4 9v11h11.28a2 2 0 0 0 2-1.7l1.38-9a2 2 0 0 0-2-2.3zM7 22H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3\"\n\t\t\t\t\t><\/path>\n\t\t\t\t<\/svg>\n\t\t\t\t<span class=\"sr-only\"> Yes <\/span>\n\t\t\t<\/button>\n\n\t\t\t<button\n\t\t\t\tdata-response=\"0\"\n\t\t\t\tdata-post=\"2055\"\n\t\t\t\tdata-post-url=\"https:\/\/www.pythontutorial.net\/tkinter\/ttk-elements\/\"\n\t\t\t\tdata-post-title=\"Ttk Elements\"\n\t\t\t\tclass=\"wth-btn-rounded wth-no-btn\"\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tfill=\"none\"\n\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t>\n\t\t\t\t\t<path\n\t\t\t\t\t\td=\"M10 15v4a3 3 0 0 0 3 3l4-9V2H5.72a2 2 0 0 0-2 1.7l-1.38 9a2 2 0 0 0 2 2.3zm7-13h2.67A2.31 2.31 0 0 1 22 4v7a2.31 2.31 0 0 1-2.33 2H17\"\n\t\t\t\t\t><\/path>\n\t\t\t\t<\/svg>\n\t\t\t\t<span class=\"sr-only\"> No <\/span>\n\t\t\t<\/button>\n\t\t<\/div>\n\t<\/header>\n\n\t<div class=\"wth-form hidden\">\n\t\t<div class=\"wth-form-wrapper\">\n\t\t\t<div class=\"wth-title\"><\/div>\n\t\t\t<textarea class=\"wth-message\"><\/textarea>\n\t\t\t<input type=\"button\" name=\"wth-submit\" class=\"wth-btn wth-btn-submit\" id=\"wth-submit\" \/>\n\t\t\t<input type=\"button\" class=\"wth-btn wth-btn-cancel\" value=\"Cancel\" \/>\n\t\t<\/div>\n\t<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>In this tutorial, you&#8217;ll learn about the ttk elements and how they are assembled into styles of widgets.<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":1232,"menu_order":47,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-2055","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.pythontutorial.net\/wp-json\/wp\/v2\/pages\/2055","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.pythontutorial.net\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.pythontutorial.net\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.pythontutorial.net\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.pythontutorial.net\/wp-json\/wp\/v2\/comments?post=2055"}],"version-history":[{"count":0,"href":"https:\/\/www.pythontutorial.net\/wp-json\/wp\/v2\/pages\/2055\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/www.pythontutorial.net\/wp-json\/wp\/v2\/pages\/1232"}],"wp:attachment":[{"href":"https:\/\/www.pythontutorial.net\/wp-json\/wp\/v2\/media?parent=2055"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}