[[["易于理解","easyToUnderstand","thumb-up"],["解决了我的问题","solvedMyProblem","thumb-up"],["其他","otherUp","thumb-up"]],[["很难理解","hardToUnderstand","thumb-down"],["信息或示例代码不正确","incorrectInformationOrSampleCode","thumb-down"],["没有我需要的信息/示例","missingTheInformationSamplesINeed","thumb-down"],["翻译问题","translationIssue","thumb-down"],["其他","otherDown","thumb-down"]],["最后更新时间 (UTC):2025-08-25。"],[],[],null,["# Create a responsive report\n\nA responsive report scales well across many different screen sizes. Choose this report type if you expect your users to regularly view the report on a tablet or other mobile device.\n\nCreate a responsive report\n--------------------------\n\nFollow these steps to create a responsive report:\n\n1. [Sign in to Looker Studio.](https://lookerstudio.google.com)\n2. Click **Create** and then select **Report**.\n3. [Add a data source](/looker/docs/studio/add-data-to-a-report) to the report.\n4. By default, the report type is set to **Freeform** . To use a responsive report, select the **Responsive** report type.\n5. [Add sections, charts, and controls](#sections) to your report, as described in the following sections.\n\nAdd sections to your report\n---------------------------\n\nIn a responsive report, components (charts and controls) are grouped into sections. Sections let you group together similar components, as well as filter on all section components at once.\n\n### Create a section\n\nTo create a new section, follow these steps:\n\n1. [Edit your report](/looker/docs/studio/edit-a-report).\n2. Click the + button before or after an existing section. This button appears only when you hover over it. \n\n If your report doesn't contain any sections yet, click **Insert**, and then select a chart type. Looker Studio will create a new section and put the new chart inside.\n\n### Add charts and controls to a section\n\nTo create a new chart or control component in a section, follow these steps:\n\n1. [Edit your report.](/looker/docs/studio/edit-a-report)\n2. If the section is empty, click either the **Add chart** or the **Add control** button in the center of the section.\n3. If the section is not empty, click either the **Add chart** or the **Add control** button on the right edge of the section. These buttons appear when you hover over a section.\n\nTo move an existing chart or control from one section to another, drag the component to the section.\n\n### Resize a section\n\nThe height of a section is determined by the height of its components.\n\nThe width of a section is not editable. Each section will always be the full width of the screen.\n\n### Add a filter to a section\n\nTo add a filter to a section, follow these steps:\n\n1. [Edit your report](/looker/docs/studio/edit-a-report).\n2. Click the section, making sure not to click any of the components. \n\n If the section is crowded with components, try clicking the six-dot icon on the left of the section. This icon appears when you hover over a section.\n3. Open the **Properties** menu and select the **Setup** tab.\n4. In the **Filter** section, under **Filter On This Group** , click **+ Add a filter**.\n\nBy default, filters in a section will apply to the entire report.\n\n#### Limit section filters to a section\n\nTo limit filters in a section to apply to only the components in the section, follow these steps:\n\n1. [Edit your report](/looker/docs/studio/edit-a-report).\n2. Click the section, making sure not to click any of the components. \n\n If the section is crowded with components, try clicking the six-dot icon on the left of the section. This icon appears when you hover over a section.\n3. Open the **Properties** menu and select the **Setup** tab.\n - To limit filters in this section to apply to only the components in the section, clear the **Apply filter controls to page** checkbox.\n - To allow filters in this section to apply to the rest of the report, select the **Apply filter controls to page** checkbox. This checkbox is selected by default.\n\n### Style a section\n\nTo customize the style of a section, follow these steps:\n\n1. [Edit your report](/looker/docs/studio/edit-a-report).\n2. Hover over a section, and select **Open Style Menu** from the options on the right hand side of the section.\n3. Change the style settings. These settings will apply to every component in the section.\n\n When you style a section, that section is no longer part of the report theme. If you apply a different theme to the report, the section won't inherit the new theme's settings.\n\n### Reorder sections\n\nTo reorder sections, follow these steps:\n\n1. [Edit your report](/looker/docs/studio/edit-a-report).\n2. Click the six-dot icon on the left of the section that you want to reorder.\n3. Drag the section to a new position to reorder the section.\n\n### Change the data source for a section\n\nTo change the data source for all components in a section, follow these steps:\n\n1. [Edit your report](/looker/docs/studio/edit-a-report).\n2. Click the section, making sure not to click any of the components.\n\n If the section is crowded with components, try right-clicking on the six-dot icon on the left of the section. This icon appears when you hover over a section.\n3. Open the **Properties** menu and select the **Setup** tab.\n\n4. In the **Data source** section, click the data source name to select another data source.\n\n### Delete a section\n\nTo delete a section, follow these steps:\n\n1. [Edit your report](/looker/docs/studio/edit-a-report).\n2. Right-click the section, making sure not to click any of the components.\n\n If the section is crowded with components, try right-clicking on the six-dot icon on the left of the section. This icon appears when you hover over a section.\n3. Click **Delete**.\n\nPreview a report for mobile devices\n-----------------------------------\n\nYou can preview how your report will look on mobile devices such as a phone or tablet. To view a preview of your report, follow these steps:\n\n1. [Edit your report](/looker/docs/studio/edit-a-report).\n2. Click the downward arrow button next to the View button on the toolbar, then select a device type. Looker Studio opens a preview of your report.\n3. To change the device size, click the **Phone** , **Tablet** , or **Large** **Screen** buttons in the bottom right corner of the preview.\n4. To exit the preview, click the **Exit Preview** button in the bottom right corner of the preview.\n\nChange report types\n-------------------\n\nYou can change the layout mode of a report between freeform and responsive. To change the layout mode of your report, follow these steps:\n\n1. [Edit your report](/looker/docs/studio/edit-a-report).\n2. Click **Theme and layout**.\n3. Click the **Layout** tab.\n4. In the **Layout mode** section, select either **Freeform** or **Responsive**.\n\nNote the following limitations and considerations when you change layouts:\n\n- Changing layouts may cause some formatting options to be lost --- including chart positions, background fills, and borders.\n- You can only change from freeform layout to responsive layout if your report has one or fewer components per page. If your report does not meet this requirement, instead [create a new responsive report](#create) and copy components from the freeform report into the new responsive report.\n\nLimitations of responsive reports\n---------------------------------\n\nThe following actions and settings are not supported for responsive reports:\n\n- [Adding lines or arrows](/looker/docs/studio/add-text-images-lines-and-shapes-to-your-reports).\n- [Configuring the canvas size](/looker/docs/studio/report-and-page-layout) and [configuring the page-level canvas size](/looker/docs/studio/report-and-page-layout): The canvas size is automatically set to fit the components of the report.\n- [Configuring the **Grid Settings**](/looker/docs/studio/report-and-page-layout): The grid is automatically set to a 12-column layout that responds to the viewer's device size.\n- [Configuring the **Snap To** settings](/looker/docs/studio/report-and-page-layout): Components are automatically arranged and aligned.\n- [Grouping components](/looker/docs/studio/arrange-group-and-distribute-components): Instead of grouping components, add components to a [section](#sections). You can apply filters at the page level or section level.\n- [Making a component report-level](/looker/docs/studio/arrange-group-and-distribute-components).\n- [Sending components forward or backward](/looker/docs/studio/arrange-group-and-distribute-components): In responsive reports, components can't overlap.\n- [Setting the **Display mode** to **Fit to Width** or **Actual size**](/looker/docs/studio/report-and-page-layout): Responsive reports scale to the width of the viewer's device.\n- [Setting the report-level component position](/looker/docs/studio/report-and-page-layout).\n- Two or more users [editing the same report](/looker/docs/studio/edit-a-report) simultaneously."]]