css – Page 4 – Learning Journal

Creating Decorative Shapes with CSS

There are many ways to utilize CSS in your designs. From text treatments to colors and images, the possibilities are endless! However, you can also create simple graphics in your design with just CSS. Let’s take a look at how it’s done!

ADDING MEDIA QUERIES

This week were learning how to put our websites to fit into mobile devices, tablet, desktop, anything to show to it will look on the screen whether its straight, vertical, and horizontal.

This is the code in adding media queries for websites @media only screen and (min-width:700px){ } then input where it says “700px” and put the size of the website you want people to be viewing and add different styles for each viewing for if its a mobile devices, tablet, or a desktop.

CSS Media Queries for Beginners: Breakpoints, Max-Width, Min-Width, and More – YouTube I was referred to watch this video to get use to media queries and how to properly use them.

Responsive Design

Responsive design felt like a scary thing when I first thought about how you would code it, but it turns out to be much simpler than I thought.

Templates for beginners

while in class were doing our final rough drafts of the website of our choosing to create about a certain topic, mine is a lawyer website and a tool that helped me use HTML and CSS to create my page and now a helpful tool for me to reference new code or refresh on the basics.

CSS Navigation Bar (w3schools.com)

Here you can look up what you’re trying to create, and it will show you how it should look like in code and in another browser window to show a live code view of how it can look on a website screen.

What I learned Week 6 AAD86

This Week was crazy and a bit new for I figured how to use figma to create site skeletons for the midterm I can tell theirs still more I have to practice when it comes to using the program. I also learned more about implementing grid to CSS to my web pages through the example projects. I hope to try some of these ideas out in my own projects. Back in my Intro class their have good float and grid layouts experience would have helped me with a lot of assignments when I got stuck.

What I Learned In Week Four

Hello Everyone I know its been a while since you have seen my last post I was having trouble with my log in for word press. For week four it was a lot of review for me, refreshing my memory on code styling. For instance I feel the week made me realizes how I can utilize styling directly on the html page rather then always separating. It’s also the week that showed me other apps to use besides File Zilla when it comes to putting my sites up live for the class.

This week also made realize how much I still have to learn in some area with making sure my links to sites work properly with the my main

New To Grid!

For this week’s reflecting on what we have been learning in class in HTML/ CSS Dreamweaver is how to make Grid’s in Dreamweaver. In doing that Grid is for two-dimensional layouts, meant to work with flex box, and when using flex box it uses heavily on “flex-wrap:wrap;” code onto Dreamweaver consider using grid instead wrap. Grid-gap helps you keep space between grid items. Grid-template-columns can take different units of measure.

Here is a video I found that’s been a reference now on understanding CSS grid and flex box in which I have been having trouble understanding.

CSS Grid Layout Crash Course – YouTube

So You Think You Can Layout?

The Big Four of CSS Positioning: Flexbox, Grid, Float, and Positioning. What is the difference and which should I be using?

CSS: All About Layout

There’s a lot of options when it comes to designing your layout in CSS. From flexbox properties to positioning, here’s all you need to know about CSS layout to get your designs to look awesome.

ADOBE XD

Is Adobe XD easy to use for the first time? This week we had to create an outline for our Mid-Term Projects. I was debating whether to use Adobe XD or Illustrator.

WHAT IS CSS?

CSS stands for Cascading Style Sheets its a declarative language and its a great way to organize the content by changing the layout, adding color, and changing fonts.

update on HTML

In class we have been learning the basics of HTML and CSS of assembling it on Dreamweaver. The basic elements of creating the specific code we want as in <header> <p> <a href> <h1> <body> , etc to create and become familiar in the basics of setting up the code for a website. Also learning how to transfer files on an FTP I use FileZilla, to make our sites live has really been exciting. We are also setting up a portal page to link our projects for this semester.

here’s a little video I found that was interesting for typography

Diving Into the Basics of CSS

It’s important to know how to change the basic rules of CSS using Dreamweaver, such as font, color, and spacing.

CSS Refresh and font-size.

These are two topic I have struggled with and one is resolved. I have the answer, Your Welcome. The other will probably be an ongoing learning battle.

Return to HTML

It’s been over a year since I’ve taken Web Design I. I took interaction design in fall of 2021, but I still felt like I needed to improve my HTML and CSS skills more.

IDs vs Classes in HTML

When I first started learning HTML the differences between IDs and classes wasn’t very clear to me and I would mix them up often. I thought they were interchangeable, and while they do very similar things they have their differences and advantages. Here’s a refresher!

Tag: css