Show the concept of applying CSS technique Media Query @media to develop a responsive web design. Use the code segment in Flgure 2 to elaborate your answer. @media only screen and (max-width:768) { .left, .main, .right { width:100%; } #para { font-size: 20px;

Show the concept of applying CSS technique Media Query @media to develop a responsive web design. Use the code segment in Flgure 2 to elaborate your answer. @media only screen and (max-width:768) { .left, .main, .right { width:100%; } #para { font-size: 20px;

Database System Concepts

7th Edition

ISBN:9780078022159

Author:Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan

Publisher:Abraham Silberschatz Professor, Henry F. Korth, S. Sudarshan

Chapter1: Introduction

Section: Chapter Questions

Problem 1PE

See similar textbooks

Related questions

Q: The junior web developer in your team is confused about the different display properties for HTML5…

A: The display CSS property sets whether an element is treated as a block or inline element and the…

Q: Login and Registration Form in HTML | CodingNepal…

A: create mysql database using node.js in javascript

Q: bb. What is the purpose of using CSS? What are the various types of the CSS? Write the syntax and…

A: CSS(Cascading Style Sheets) describe the way to style an HTML document., how the HTML elements are…

Q: HTML In strictly default block vertical coordinates, the reference positions for the next element…

A: In strictly default block vertical coordinates, the reference positions for the next element…

Q: 3. Apply a unique rotate transform to each sticky note below. Use values between -75deg and 75deg.…

A: Here we will use transition. Transition help us to allow certain properties over a given time…

Q: I need to split these into grid.html and grid.css and to make I need help because right now my…

A: I highlight grid css part

Q: i am working on Old masters code 1-3 but i keep getting an error on my this is for HTML using…

A: In this given question, the HTML code is given that contains different formatting elements. The task…

Q: Modify the given page “lab9-form.html” so it can be better viewed and used on mobile devices. Make…

A: <!DOCTYPE html> <html lang="en"><head><meta charset="utf-8"…

Q: Question 1: How can you apply translate property in CSS on an image when the user hovers it with…

A: Objective: Sometimes, an image is required to move or translate from one position to another.…

Q: Lab 14 Sticky Note Board Transforms CSS transforms change the shape and position of the…

A: Applying background color for the sticky note . Using CSS

Q: Find all textareas and paragraphs, and make a red border around them and set the border to red.…

A: HTML Code : <!DOCTYPE html> <html> <head> <script…

Q: QUESTION 7 is the person how is responsible of creating HTML and CSS code for website. O Graphic…

A: Web development is the process of developing complete web page

Q: * After the user enters the phone number, pop up a Good Luck alert message > use onblur and name…

A: document.getElementById("txtNumber").addEventListener("blur", goodLuck); //function goodLuck()…

Q: Read the following block of CSS code, and then answer the question. body { position: relative;…

A: Answer: position: relative; - the element is positioned relative to its normal position so left…

Q: interactive HTML/CSS with Bootstrap

A: here have to determine about beautiful interactive HTML/CSS .

Q: 02 03 04

A: <!DOCTYPE html> <html> <meta name="viewport"…

Q: ive an example of a CSS element that will cause an image to be repeated in the background only along…

A: INTRODUCTION: Background pictures are repeated according to the background-repeat CSS property. A…

Q: 3 N 5 6. 9 10 N N N N N N

A: As per our guidelines, we are supposed to answer only one question. Kindly repost the other…

Q: I need to split these into grid.html and grid.css

A: HTML- <html lang="en"><head><meta charset="UTF-8"><meta name="viewport"…

Q: I am working on Path of Light Yoga Studio Case Study Chapter 6 and I cannot make it look right. This…

A: here i mentioned html and css file code with changes. changes like in image id and dec id and span…

Q: Create a web page and split the web page in the following format using frames. Frame(1,1) Frame(2)…

A: Code: dy.html(main page): <html> <head> <style> frame{…

Q: Tutorials Home PHP Web - jQuery HTML CsS Carousel Bootstrap» Bootstrap Tabs Alerts Choco bar Free…

A: <!DOCTYPE html><html><head> <title>navbar example</title>…

Q: I need to split these into grid.html and grid.css and to make i need help becase right now my style…

A: You only need to perform these changes- 1) make new css file 2) copy the code within…

Q: 6. HTML Code fragment like in figure And CSS code for the HTML like follows (imagine HTML is linked…

A: CSS, HTML Padding color and margin top and margin bottom color of the table

Q: 3. Apply a unique rotate transform to each sticky note below. Use values between 75deg and 75deg…

A: 3.> here , for giving unique rotation to each sticky note :- we use CSS properties like :-…

Q: how could i make the submit ,average and reset button all disable until i enter a number between…

A: The fixed HTML and JavaScript codes are given below.

Q: deling in HTML and CSS, discuss whether you think the proc

A: As you learn about box modeling in HTML and CSS, discuss whether you think the process is an easy…

Q: QUESTION 1 When you set the margin left and margin right vaas to auto, then the element will be…

A: Html provides many features such as padding, border , margin etc that makes look of web page…

Q: Fill in the missing HTML tag by dragging the correct HTML tag or attribute or CSS property to the…

A: Answer: <html><head><title>Q11</title> <style type="text/css">…

Q: i need help with the LAB CSS and html practice The orange section:…

A: HTML CODE:  <html> …

Q: Create a CSS style for an H3 element, where: - colour is blue (in RGB format) - text aligned to…

A: A CSS style for an H3 element, where: - color is blue (in RGB format) - text aligned to left - text…

Q: Style to be applied Method 1. Make the first element to have a text color #9b59b6 2. Make all…

A: Solution: CSS style in HTML file 1) make the first <h2> element to have text color #9b59b6 h2{…

Q: CSS not working, Figure 1 is my output, and Figure 2 is the desired output. What's wrong? ---…

A: All the CSS classes are written correctly in the head section, inside the style tag. To add the CSS…

Q: i cant seem to find the problem, im only using notepad. i need to recreate this. this is my…

A: The editing of the following problem is given below.

Q: I need to code the CSS to the image below relative to this HTML: a b x y one two three…

A: For the above code, the Internal style sheet used. Note: color may vary.

Q: 3. Apply a unique rotate transform to each sticky note below. Use values between -75deg and 75deg…

A: For 3 Part we can use transform. Here I will be using 100 deg for rotation. For 4 Part we have to…

Q: I need to split these into grid.html and grid.css and to make I need help because right now my…

A: GRID.HTML <html lang="en"><head><meta charset="UTF-8"><meta name="viewport"…

Q: JavaScript & jQuery - Chapter 5: Document Object Model - Example List…

A: Code: <!DOCTYPE html><html lang="en"> <head> <title>JavaScript &amp;…

Q: I need help with making me auditioned needed in the image I have provided the code I have so far…

A: The Answer is

Q: A Moving to another question will save this response. Question 1 Create a CSS style for an H3…

A: Html page for css style sheet

Q: CAN YOU MAKE THE CODE BELOW RESPONSIVE BY ADDING MEDIA QUERIES? HTML CODE: Document…

A: Media Queries added to CSS file: @import…

Q: Apply Boostrap to this code Source Code in HTML: Employee Registration Form Name:…

A: What is bootstrap? bootstrap is a tool which can be used for easy styling of our html pages using…

Q: Create a webpage applying the new HTML 5 semantic elements and design using CSS based on the…

A: In step 2, you will the html code.In step 3, you can see the sample output.

Q: the html is like this 1.css .box1 { background-color: black; border: 15px; color: rgb(255, 0,…

A: Your html code is given below with an explanation and output as you required.

Q: 1. Create HTML file with name nizwafort.html 2. Using internal CSS set the following: a. Common page…

A: Question given: Design a HTML website using CSS for display information about Nizwa Fort.…

Q: Can you tell me why this is not properly displaying

A: Below i have pointed.

Q: div ul { color: red; text-align: center; } I. Item 1 Item 2 II. Some text in a div. III. Item…

A: ANS: - The correct option is (A). I only

Q: CSS not working, Figure 1 is my output, and Figure 2 is the desired output. What's wrong

A: After fixing the code , I have provided HTML CODE and OUTPUT SCREENSHOT--------------…

Question

c) Tunjukkan konsep aplikasi teknik CSS Media Query @media untuk membangunkan reka
bentuk web yang responsif. Gunakan kod segmen di Rajah 2 untuk menghuraikan jawapan
anda.
Show the concept of applying CSS technique Media Query @media to develop a responsive
web design. Use the code segment in Figure 2 to elaborate your answer.
@media only screen and (max-width:768) {
.left, .main, .right {
width:100%;
}
#para {
font-size: 20px;
}
Rajah 2/Figure 2

Expert Solution

This question has been solved!

Explore an expertly crafted, step-by-step solution for a thorough understanding of key concepts.

SEE SOLUTION Check out a sample Q&A here

Step 1

VIEW

Step 2

VIEW

Step 3

VIEW

Step by step

Solved in 3 steps

SEE SOLUTION Check out a sample Q&A here

Knowledge Booster

Learn more about

Need a deep-dive on the concept behind this application? Look no further. Learn more about this topic, computer-science and related others by exploring similar questions and additional content below.

Similar questions

Design a responsive webpage using media query as shown in the following image. Your design should have three views namely Desktop, Tablet and Mobile views. Your final answer should looks similar to the given examples using the required CSS styles. RESPONSIVE WEB DESIGN A WORKING EXAMPLE
Students will create a responsive web page following the model of a clothes-based business. The page will include a text (and possibly image) based logo and at least six images, along with text added to the images-not through Photoshop. A header (and title) must be included, as must (non-working) links to at least six pages within the site (that should not be created.) The assignment should be linked from your first assignment 1 page in the nav bar and vice versa. Color choice, typography, and simplicity/appropriateness of images will be considered in grading. The HTML should validate with an external CSS file. The site must be responsive-although a hamburger navigation icon is not necessary.
Using appropriate code snippets, illustrate the 3 major ways of inserting CSS in HTML documents
Create a media query in CSS, which applies the following style to the body of a HTML document, only when the width of the screen exceeds 500px.
As you learn about box modeling in HTML and CSS, discuss whether you think the process is an easy one, or a difficult one. Also; list two advantages and one disadvantage to using such a method to manage your website builds.
Computer Science Locate six websites: two e-commerce websites, two blogs about web design, and two organizational websites. Familiarize yourself with the navigation on each website. 2. Examine how each website presents text links. Does the link text clearly identify the link’s target webpage or content? Do tooltips appear when you point to a text link? Does the website use both color and formatting to define text links? How are fresh and followed links differentiated? Are hidden or rollover text links used? 3. Examine how each website presents menus. What type(s) of menus does the website use? Do any examples of hidden menus exist? Were they easy to find and use? 4. Will the results of your research determine what type(s) of navigation you would use as a web designer? If yes, how? If no, why not?
QUESTION 7 is the person how is responsible of creating HTML and CSS code for website. O Graphic Designer Database Administrator Web Developer Content Manager QUESTION 8 Use CSS to apply a style to one or more elements on a web page • Group selector OId selector Class selector Click Save and Submit to saue and submit. Click Save All Ansers to save all aSer EGO Ps
Write any 5 internationalization attributes in HTML5, please explain with the help of HTML5 Code and example.
using HTML Table elements design a webpage to display exactly the following HTML UAE FLAG USING TABLE + → c O Fil | M Gmail YouTube m View all submissions m Attempts: 4 9 Maps e Formal Languages O SystemDesignDocu. becogrito 6) I caption UAE FLAG Border size 30 black color Table data cell height 100 (for each row) ........ Column width 100 Column width 300
Name four examples of hyperlink target attribute with their definitions.
using javascript html css - a web-page matrix calculation (such as matrix multiplication of matrices (5x5 at most) entered in the web page) the web-page should be mobile compatible. i want this website code.thank you for help.
Explore the concept of responsive web design and its importance in modern web development. How can CSS frameworks like Bootstrap assist in creating responsive layouts?